我在div中有一些输入。看起来如下:
<div name="emailInput">
<input type="text" name="email_1" /></div>
<div name="phoneInput">
<input type="text" name="phone_number_1" /></div>
<div name="emailInput">
<input type="text" name="email_2" /></div>
<div name="phoneInput">
<input type="text" name="phone_number_2" /></div>
<div name="emailInput">
<input type="text" name="email_3" /></div>
<div name="phoneInput">
<input type="text" name="phone_number_3" /></div>
但在某些情况下,我需要改变输入的顺序。具体来说,我想交换电子邮件和电话位置。结果必须是:
<div name="emailInput">
<input type="text" name="phone_number_1" /></div>
<div name="phoneInput">
<input type="text" name="email_1" /></div>
<div name="emailInput">
<input type="text" name="phone_number_2" /></div>
<div name="phoneInput">
<input type="text" name="email_2" /></div>
<div name="emailInput">
<input type="text" name="phone_number_3" /></div>
<div name="phoneInput">
<input type="text" name="email_3" /></div>
为了实现我的目标,我编写了jquery代码:
$('div[name^= emailInput]').insertBefore('div[name^= phoneInput]');
此代码在每个emailInputs div之前交换了整个phoneInputs div。我如何逐个交换div? (输入的计数是未知的)
此外,
$('input[name^= email]').insertBefore('input[name^= phone_number]');
不起作用。
答案 0 :(得分:0)
我没试过这个..但我认为它应该是这样的:
$('div[name=^ emailInput]').each(obj, function(i, val) {
obj.insertBefore('div[name^= phoneInput]');
});
答案 1 :(得分:0)
您需要单独操作它们,而不是整个选择器组。
$('div[name^="emailInput"]').each(function(){
var previousPhoneInput = $(this).prev("div[name^='phoneInput']");
$(this).remove().insertBefore(previousPhoneInput);
});
答案 2 :(得分:0)
试试这个:
$('input[name^="phone_number"]').each(function(){
var $this = $(this);
var $prev = $this.parent().prev()
$prev.find('input').insertAfter($this);
$this.appendTo($prev)
})
您也可以更改div标签的位置。
$('div[name="phoneInput"]').each(function(){
var $this = $(this);
$this.insertBefore($this.prev())
})