jQuery onChange将字段值添加到HTML

Question

我想将输入字段的值实时打印到DIV。

现在我有这样的：

 $("#page_name").change(function() { 

      var new_val = $("#page_name").val(); 

      $("#page_url").html(new_val); 

     }); 

它不工作，效果显着。任何人都有一个建议？

谢谢！

Answer 1

正如指出的“变化”，只有当元素失去焦点时发生。将它绑定到按键事件的另一种方法是将其绑定到“输入”事件。

$('#page_name').bind('input', function(e){ 
    var output = e.target.value; 
    $('#page_url').text(output); 
}); 

http://jsfiddle.net/xY7Q6/

与按键的问题是，它不复制&粘贴文本。

输入事件几乎是什么大家都希望“变革”是（○：？我觉得这个事件是相当新的（HTML5），旧的浏览器可能不会得到一个

Answer 2

那应该实际上工作。我最好的猜测是这样的：

1. 检查你的选择器，也许。此外，您可以使用$（this）而不是第二次选择#page_name。
2. 变化并不总是像你想象的那样经常发生。尝试将事件绑定到键入。
3. 此外，它可能是一个坏主意.html（）节点。你可能想要.text（）它是安全的。

Answer 3

实际上它会工作，但只有当您将光标移出输入框时，因为更改在焦点丢失时触发。

你需要的是按键。该代码只是你的一样

$("#page_name").keypress(function() { 
      var new_val = $("#page_name").val(); 
      $("#page_url").html(new_val); 
}); 

测试在这里

http://jsfiddle.net/y3zpP/