0 
 <span>This Changes as You Type in Input1</span><br>

 <input type="text" id="input1"><br><br>

 <span>This Changes as You Type Type in Input2</span><br>

 <input type="text" id="input2"><br><br>

当用户在输入文本中输入时，我希望 jquery 搜索上面的 span 标签并在用户输入时动态更改它。我只是在此示例中使用更改，因为如果我使用 keypress 它会忽略最后一次按下的按键。

 //my jquery attempt that's not working
 $('#input1').change(function() {
 $(this).closest('span').html($(this).val()    
 });

想知道我是否可以使用类有效地编写代码，而不是为每个 id 重复这个更改函数。例如，如果我可以将其设为一个类并且它会更改其上方最近标签上的文本？

 //Like this?
 $('.inputclass').change(function() {
 $(this).closest('span').html($(this).val()    
 });
4

2 回答 2

0

问题是 javascript 格式错误。你错过了)你的结束.html() 

 $(this).closest('span').html($(this).val()

至

 $(this).closest('span').html($(this).val());
于 2013-01-16T04:44:04.023 回答
0

虽然.closest()可以正常工作，但我建议您执行以下操作以获得更好的 html 结构。

<div>
    <span>This Changes as You Type in Input1</span><br>
    <input type="text" id="input1"><br><br>
</div>

<div>
    <span>This Changes as You Type in Input2</span><br>
    <input type="text" id="input2"><br><br>
</div>

将您的input和它对应span在父元素中。显然，使用类，因为它可以避免代码中的冗余。

一旦你这样做了，.closest()就可以正常工作，但你会更好地使用它.siblings()。

jQuery：

你缺少一个右括号)，.html()你的行需要是这样的，

$(this).closest('span').html($(this).val())
于 2013-01-16T04:49:01.193 回答