Question

我有一个表单项列表 - 一个名称和一个删除项目的复选框。

<input value="www…" name="web[]" type="text" class="siteName"/>
<input name="delete" type="checkbox" value="delete" class="delete"/>

我创建了这个以交换两个项之间的字段值，以便清空文本字段，但如果错误，则值将存储在复选框中。

<script type="text/javascript"> 
$(function () { 
    $('.delete').change(function(){
        var oldVal = $('.siteName').val();
        $('.siteName').val($(this).val());
        $(this).val(oldVal);
    });
});
</script>

如果有多组表单项都被更改，我可以设置它以便以前的“.siteName”表单项是唯一一个更改的（我试过.prev（）无效但不使用如何使用它正确）。我可以轻松地创建脚本的多个实例并为类名编号，但我认为会有更优雅的解决方案。

Answer 1

是..使用this引用和prev()

$('.delete').change(function(){
    var siteEle=$(this).prev();
    var oldVal = siteEle.val();
    siteEle.val($(this).val());
    $(this).val(oldVal);
});

或最近的（）

$('.delete').change(function(){
    var siteEle=$(this).closest('.siteName');
    var oldVal = siteEle.val();
    siteEle.val($(this).val());
    $(this).val(oldVal);
});

如果在复选框旁边再次启动siteName输入，

closest()可能不会给你正确的值..所以如果你确定前一个元素是输入类siteName，那么prev()更好

Answer 2

$(function () { 
    $('.delete').change(function(){
        var $myPrevSiteName = $(this).prev('.siteName');
        var oldVal = $myPrevSiteName.val();
        $myPrevSiteName.val( this.value );
        $(this).val(oldVal);
    });
});

Answer 3

我想我没有放弃了解你的问题，但让我尝试一下你是否想要实现这样的目标

http://jsbin.com/ajavul/2/edit

而不是使用prev（）我将父标记中的每个输入和复选框都包装起来，然后我在其上应用jquery代码并进行一些小的更改。如果这不是你想要达到的目的，请提供更多信息。

带有jquery的上一个表单项

3 个答案: