Question

我有两个输入文本，我想使用jquery对它们进行操作。输入文本是：

null + ', '

我想在第一个输入中输入一个数字，并且实时地应该在第二个输入中输入这个数字

我该怎么办？

Answer 1

在#field1文本框中使用keyup事件。

<强> HTML

<p>
    <label>Title 1</label>
    <span class="field">
        <input type="text" name="field1" id="field1" class="width100" value="<?php echo $field1t; ?>"  />
    </span>
</p>
<p>
    <label>Title 2</label>
    <span class="field">
        <input type="text" name="field2" id="field2" class="width100" value="<?php echo $field2t ?>"  />
    </span>
</p>

<强>的Javascript

// On every keyup of textbox
$('#field1').on('keyup', function () {
    $('#field2').val($(this).val());
    // Set the text in field1 into field2
});

DEMO

Answer 2

试试这个fiddle。

$('#field1').keyup(function() {        
    var selThisVal = $(this).val();
    $('#field2').val(selThisVal);
})

Answer 3

两个输入都不能具有相同的id's。 ID's should be unique。
您可以使用.change或.keyup事件来更改第二个输入值。

使用.change

＆＃13;

$('input[name="field1"]').change(function(){
    $('input[name="field2"]').val($(this).val());
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
    <label>Title 1</label>
    <span class="field">
        <input type="text" name="field1" id="field2" class="width100" value="<?php echo $field1t; ?>"  />
    </span>
</p>
<p>
    <label>Title 2</label>
    <span class="field">
        <input type="text" name="field2" id="field2" class="width100" value="<?php echo $field2t ?>"  />
    </span>
</p>

＆＃13;

使用.kepup

＆＃13;

$('input[name="field1"]').keyup(function(){
    $('input[name="field2"]').val($(this).val());
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
    <label>Title 1</label>
    <span class="field">
        <input type="text" name="field1" id="field2" class="width100" value="<?php echo $field1t; ?>"  />
    </span>
</p>
<p>
    <label>Title 2</label>
    <span class="field">
        <input type="text" name="field2" id="field2" class="width100" value="<?php echo $field2t ?>"  />
    </span>
</p>

＆＃13;

Answer 4

您可以使用input事件来同步内容。每当input或<input>元素的值被用户（而不是代码）更改时，<textarea>事件就会被提升。在你的情况下，这比keyup事件略好一些，因为它忽略了诸如左箭头命中等之类的东西，只有在值实际发生变化时才会被提升。与jQuery：

一起使用

$('#field1').on("input", function(){
    $('#field2').val($('#field1').val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
    <input id="field1" />
</p>
<p>
    <input id="field2" />
</p>

或纯粹的js：

document.getElementById("field1").oninput = function(){
    document.getElementById("field2").value = this.value;    
};

<p>
    <input id="field1" />
</p>
<p>
    <input id="field2" />
</p>

Answer 5

首先将第一个文本框的ID更新为field1，现在您对两个文本框都有相同的ID。

然后尝试给出脚本。

<script type="text/javascript">
    $(document).ready(function(){
        $("#field1").keyup(function(){
            $("#field2").val($("#field1").val());
        });
    })
</script>

jQuery和实时操作

5 个答案: