Question

任何人都可以告诉我在编辑左侧文本字段时如何实现此功能，它会更新右侧的文本字段。我的猜测是使用AJAX。我也想用它。我该怎么做呢需要做什么。这是链接。http://printbindaas.com/bjp

Answer 1

只是常规的JavaScript。在keyup事件中，右侧div获得与左侧div相同的内容。

Answer 2

在每个输入上放置一个data-元素，其中包含与其相关的div的ID，即：

<input data-rel="name" type="text" name="name" />
<div id="name" />

$(':input').on('change keyup', function() {
    var rel = $(this).data('rel');
    if (rel) {
        $('#' + rel).text(this.value);
    }
});

或者，使用输入的name字段：

<input type="text" name="name" />
<div id="field_name" />

$(':input').on('change keyup', function() {
     $('#field_' + this.name).text(this.value);
});

Answer 3

你去了 - http://jsfiddle.net/JpUuk/

HTML：

Name: <input type="text" id="name">
<div style="border: 1px solid black">Your name is: <span id="name_out"></span></div>

JavaScript（使用jQuery）：

$('#name').bind('keyup', function() {
    $('#name_out').html(this.value);
})

或使用纯JavaScript：

document.getElementById('name').onkeyup = function() {
    document.getElementById('name_out').innerHTML = document.getElementById('name').value;
};

如何使用AJAX同时编辑两个div

3 个答案: