CODEWITHSUNDEEP
javascriptjqueryhtml
Hagaymosko
Hagaymosko

Reputation: 51

Can't change value of div with jQuery

I have a problem in jQuery: I wrote this code:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $("#input").keyup(function() {
        var input = $("#input").val();
        var input = input.replace("d", "f");
        $("#text").val(input);
    });
});
</script>
</head>
<body>
<center>
<input type="text" id="input" />
<div id="text"></div>
</center>
</body>
</html>

This code's suppose to check if there are any d's in the the variable "input" (which is received from an input box in the body) and replace those d's with f's (this is just a little experiment before I try to replace letters of one language to letters of another). but it doesn't work and I don't know why. I tried to replace the $("#text").val(input); with alert(input); and it worked but it only replaces the first "d" to "f" and the second and third d's aren't replaced and they stay "d". Please help me. Thank you.

Upvotes: 2

Views: 2363

Answers (9)

Yogesh Sharma
Yogesh Sharma

Reputation: 2017

Please use below jQuery code:

$(document).ready(function() {
    $("#input").keyup(function() {
        var input = $("#input").val();
        var input1 = input.replace("d", "f");
        $("#text").html(input1);
    });
});

It's working see demo: http://jsfiddle.net/V2LBu/1/

Upvotes: 0

user3464865
user3464865

Reputation: 1

replace will only replace the string for the first time. To perform a global replace use the below code. To assign the value to the div use either $("#text").html(input); or $("#text").text(input);

$("#input").keyup(function () {
    var input = $("#input1").val();
    var input = input.replace(/d/g, "f");
    $("#text").html(input);
});

Upvotes: 0

Suresh Ponnukalai
Suresh Ponnukalai

Reputation: 13988

the default .replace() behavior is to replace only the first match, the /g modifier (global) tells it to replace all occurrences. So you need to write your function like below.

$(document).ready(function() {
  $("#input").keyup(function() {
    var input = $(this).val().replace(/d/g, "f");        
    $("#text").html(input);
  });
});

Fiddle Demo

Upvotes: 1

Balachandran
Balachandran

Reputation: 9637

You have non input tag use .text() or .html(). if you have input type then only you have to use .val();

$("#text").text(input);

Upvotes: 0

Prabahar
Prabahar

Reputation: 119

Try replaceAll() method instead of replace.

Upvotes: 0

budamivardi
budamivardi

Reputation: 760

For text

$("#divname").text("new text");

for html

$("#divname").html("<b>new html</b>")

Upvotes: 0

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28513

for div you need to use .text() instead of .val() because there is no value attribute present for div :

$(document).ready(function() {
    $("#input").keyup(function() {
        var input = $("#input").val();
        var input = input.replace("d", "f");
        $("#text").text(input);
    });
});

Upvotes: 0

Govind Singh
Govind Singh

Reputation: 15490

suggestion:please use right name to identify
replcae: val() to html()

<script>
$(document).ready(function() {
    $("#input").keyup(function() {
        var input = $("#input1").val();
        var input = input.replace("d", "f");
        $("#text").html(input);
    });
});
</script>
</head>
<body>
<center>
<input type="text" id="input1" />
<div id="text1"></div>

Upvotes: 1

Adil
Adil

Reputation: 148110

You need html() or text() for div instead of val() 

$("#text").html(input);

Upvotes: 4

Related Questions