5

我有一个文本框和一个标签。如果用户想要更改标签文本，他/她必须在文本框中输入文本。每次用户在更改文本框中输入内容时，如何更新标签文本？

我知道可以将 AJAX 与 jQuery 和 PHP 一起使用。有没有更简单的方法？请告诉我。这是我的代码和链接：http: //jsfiddle.net/uQ54g/1/

$('#change1').change(function(){
    var l = $(this).val();
    $('label').replaceWith(l);


});
4

5 回答 5

4

首先，您必须在 jquery 中使用.text或.html设置标签内的文本。您当前的代码实际上将删除标签元素并仅替换为文本。因此，如果您再次尝试编辑该值，它将不再起作用。您可能还想在标签中添加一个类或一个 ID，因为您很可能会在一个页面上拥有多个标签。

HTML：

<input type="text" id="change1"/><br/>
<label id="test">Hello</label>

Javascript：

$('#change1').change(function(){
    var l = $(this).val();
    $('#test').text(l);
    // OR $('#test').html(l);
});

如果您想在输入每个字符后更改标签，则需要使用keyup而不是change.

这是一个更新的jsfiddle ​</p>

于 2012-05-05T03:29:14.740 回答
2

正如我在评论中提到的那样，您小提琴中的代码工作正常，或者您可以keyup使用

$('#change1').keyup(function(){
var l = $(this).val();
$('label').text(l);
//alert($('#change1').val())
});

http://jsfiddle.net/uQ54g/4/

另请注意，当您使用replaceWith它时，它将替换匹配的元素，在您的情况下，它label在触发更改<label>hello</label>后将被替换为，Changed Text因此如果您$("label")再次这样做，它将返回未定义，请自行查看

于 2012-05-05T03:30:25.820 回答
1

试试这个：

$('#change1').keyup(function(){
l=$(this).val()
$('label').html(l)
})
于 2012-05-05T03:37:42.270 回答
1

将此与 jquery 库一起使用

$('#change1').on('keyup',function(){ //Change1 is id of textbox
   $('#label1').html($(this).val()) //label1 is the id of the label
});
$('#change1').blur(function() { //if we copy paste some text into the textbox it will also work if use this blur and trigger function
   $(this).trigger('keyup');
});
于 2012-05-05T04:26:53.687 回答
0

这个怎么样

$('#change1').change(function(item){
     $('label').text(item.target.value);
});
于 2012-05-05T03:42:08.233 回答