Vishnu
Vishnu

Reputation: 103

Replacing a string in url with another string

Replacing imgur with filmot,

Input box - https://i.sstatic.net/Uguvn.jpg

Submit button

Once the submit is clicked in a new tab http://i.filmot.com/abcde.jpg has to open.

<html>
 <head>
 <title>input</title>
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script>
function myFunction() {
    var res = str1.replace("imgur", "filmot");
    var win = window.open(res, '_blank');
    win.focus();
});
</script>
</head>
<body>
 <form>
 <input type=”text” id=”str1” />
<button onclick="myFunction()">Click</button>
</form>
</body>
</html>

The return code is not working. Please suggest.

Thanks :)

EDIT:

Here is solution code :)

<html>
 <head>
 <title>input</title>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function myFunction() {
  var str1 = document.getElementById('str1').value;
  var res = str1.replace("imgur", "filmot");
  document.getElementById('str1').value = res;
  var win = window.open(res, '_blank');
  win.focus();
}
</script>
</head>
<body>
<input type="text" id="str1" />
<button onclick="myFunction()">Click</button> 
</body>
</html>

Upvotes: 0

Views: 3268

Answers (4)

Sarah
Sarah

Reputation: 525

Please try this :

<html>
 <head>
 <title>input</title>
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script>
function myFunction() {
    var newString=str1.value;
    var res = newString.replace("imgur", "filmot");
    var win = window.open(res, '_blank');
    win.focus();
};
</script>
</head>
<body>
 <form>
 <input type="text" id="str1" value=""/>
<button onclick="myFunction();">Click</button>
</form>
</body>
</html>

Upvotes: 0

cнŝdk
cнŝdk

Reputation: 32175

Referring to the Opening a New Window tutorial:

To open a new window, you will need to use yet another ready-made JavaScript function. Here is what it looks like:

window.open('url to open','window name','attribute1,attribute2')

And I've Edited the function (added the window name') and it's working fine, replaces the url a,nd open it in a new tab:

function myFunction() {
  var str1 = document.getElementById('str1').value;
  var res = str1.replace("imgur", "filmot");
  window.open(res, 'new window', '_blank');
} 

Here is the working DEMO.

Upvotes: 0

Jai
Jai

Reputation: 74748

Try this:

<script>
function myFunction() {
   var str1 = document.getElementById('str1').value; // add this
   var res = str1.replace("imgur", "filmot");
   var win = window.open(res, '_blank');
   win.focus();
} // <-----do a proper function closing.
</script>

Need to mention another thing may be the type=”text” id=”str1” quotes you are using, they are not the proper quotes. That should be changed to:

type="text" id="str1"

checkout the demo:

function myFunction() {
  var str1 = document.getElementById('str1').value;
  var res = str1.replace("imgur", "filmot");
  document.getElementById('str1').value = res;
  //window.open(res, '_blank');
  //win.focus();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<input type="text" id="str1" value="http://i.imgur.com/abcde.jpg" />
<button onclick="myFunction()">Click</button>

Upvotes: 3

scartag
scartag

Reputation: 17680

Change this code.

var res = str1.replace("imgur", "filmot");

to

var res = $("#str1").val().replace("imgur", "filmot");

Your code wasn't getting the value from the textbox .. you were merely using a reference to the textbox.

Update

At the end of the function change }); to }

Upvotes: 0

Related Questions