Question

我基本上是在尝试复制我的选择器并创建一个新的...这就是我想要实现的......

我在divone中有很多输入，不想在我的jquery中列出每一个，所以我想动态找到对象并链接到相应的divtwo对象

<div id="divOne">
<input type="textbox" id="tb1" value="TEXTHERE">
<input type="textbox" id="tb2" value="TEXTHERE">
</div>
<div id="divTwo">
<input type="textbox" id="tb3" value="TEXTHERE">
<input type="textbox" id="tb4" value="TEXTHERE">
</div>

$("#divOne:input").bind("keyup change", function(e) {
            var selector = ($(this).selector()); //hoping this would return input object from DivOne
            var value = ($(this).val());
            var newselector = //modify divOne object to have divTwo selector
            $(newselector).val() = value;

        });

然后我想将divOne文本保存到divTwo文本框中。

我希望它看起来像这样，只使用它。因此，我想将tb1的文本框值更改为“textthere”：

$("#divOne:input").bind("keyup change", function(e) {
                    var selector = $(#divOne.attr("id", tb1"));  //this should be covered dynamically using $this or another jquery method
                    var newselector = $(#divTwo.attr("id", tb3)); //this however should be generated dynamically by selector var
                    $(newselector).val() = selector.val();

                });

由于

Answer 1

根据我的理解，你想将第一个div中的输入值复制到第二个div中的相应输入。

因此，您必须先使用region查找输入的索引，然后在选择器中使用#region以匹配第二个div中的相应输入。

index()

检查这个小提琴https://jsfiddle.net/qfey8L14/3/

Answer 2

如果您想匹配相应的元素，可以使用index()和eq()

var $d1Inputs = $("#divOne input").on("keyup",function(e) {
     var index = $d1Inputs.index(this);
     $('#divTwo input').eq(index).val($(this).val()); 
});

Answer 3

正如您尝试做的那样，对第二个输入进行更改，然后对第一个div进行更改;你可以尝试 -

$(document).on('keyup chage','#divOne input',function(){
   // will gives index of divone input while keyup or change event occurs
   $index=$('#divOne input').index($(this));
   // selects input from #divTwo in array from
   $divtwoinputs=$('#divTwo input');
   // now reflect the value on #divtwo inputs
   $($divtwoinputs[$index]).val($(this).val());
});

希望这可以解决您的问题，如果没有请让我知道...如果修复您的问题接受这个作为答案...

Answer 4

如何使用input事件和.index()方法如下：

$('#divOne > :input').on('input', function() {
    var index = $(this).index();
    $('#divTwo > :input').eq( index ).val( this.value );
});

$('#divOne > :input').on('input', function() {
    var index = $(this).index();
    $('#divTwo > :input').eq( index ).val( this.value );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divOne">
<input type="textbox" id="tb1" placeholder="TEXT HERE">
<input type="textbox" id="tb2" placeholder="TEXT HERE">
<select id="sl1">
  <option value="">Select</option>
  <option>1</option>
  <option>2</option>
</select>
</div>
<div id="divTwo">
<input type="textbox" id="tb3" placeholder="TEXT HERE">
<input type="textbox" id="tb4" placeholder="TEXT HERE">
<select id="sl2">
  <option value="">Select</option>
  <option>1</option>
  <option>2</option>
</select>  
</div>

注意：的 :input

选择所有输入，textarea，select和button元素。

获取$ this

4 个答案: