Question

这里只是几个问题

如果我有一个表格，结构如下

<form>
<div id='dynamicFormBox'>
    <div id='parent_1'>
        <div id='level_2'>
            <div id='level_3'>
                    <input id='name' name='name' value=''/>
                    <input id='id' name='id' value=''/>
                    <input id='passNo' name='passNo' value=''/>
                    <input type="button" id="removeDiv"/>
            </div>
        </div>
    </div>
    <div id='parent_2'>
        <div id='level_2'>
            <div id='level_3'>
                    <input id='name' name='name' value=''/>
                    <input id='id' name='id' value=''/>
                    <input id='passNo' name='passNo' value=''/>
                    <input type="button" id="removeDiv"/>
            </div>
        </div>
    </div>
    <div id='parent_3'>
        <div id='level_2'>
            <div id='level_3'>
                    <input id='name' name='name' value=''/>
                    <input id='id' name='id' value=''/>
                    <input id='passNo' name='passNo' value=''/>
                    <input type="button" id="removeDiv"/>  
            </div>
        </div>
    </div>
</div>
</form>

所以我的问题是

如何从父母中的任何一方输入“姓名”？如果我在“姓名”上输入，我可以告诉“姓名”来自该父母身份而不是其他父母？
我想如何改变，比如说来自所有3个父母的输入'id'，但每个输入'id'的值不同？
我如何制作它，以便如果我更改任何输入'id'，它也会同时更改父ID？
如果说我可以使用append添加父div，我该怎么做才能根据dynamicFormBox中的子节点数改变父节点的id？就像现在一样，我有parent_1，parent_2和parent_3，所以如果我追加下一个父，那么id会自动设置为parent_4吗？
如何制作，只有父ID的'parent'部分跟随输入'id'的值？与parent_1一样，如果我将输入'id'的值更改为'john'，那么父ID将更改为'john_1'？
我如何做到这一点，只有父ID的'number'部分跟随输入'passNo'的值，同时改变它的数字格式？例如，对于parent_2，如果我将输入'passNo'的值更改为2，那么它会将父ID更改为parent_02吗？
对于id为'removeDiv'的删除按钮，如果我点击它，如果所有按钮都转到同一个removeDiv（）函数..我点击了parent_2内的按钮，我怎样才能确保它只会删除parent_2块，而不是其他块？

我知道我的一些问题已在这里得到解答，但我想知道所有输入共享相同名称和相同ID的情况，我想知道如何区分哪些输入相对于他们的属于父母。

Answer 1

如何从父母中的任何一方输入“姓名”？如果我在“姓名”上输入，我可以告诉“姓名”来自该父母身份而不是其他父母？

这将从parent_3

var value = $('#parent_3 input[name=name]').val();

我想如何改变，比如说来自所有3个父母的输入'id'，但每个输入'id'的值不同？

只需使用循环:)这取决于你，你只需要为此实现正确的选择问题：

假设我们将为此定义一个新函数:)它将获得带有新字段值的parentId和JSON。多亏了你可以通过一个函数调用来设置整个表单，你只需要创建一个json obj。

var newValues = { name: 'new name value', 'passNo': 'new_Value' }
function setVal(parentId, newValues){
if(newValues.name)
$('#'+parentId+' input[name=name]').val(newValues.name);
if(newValues.passNo)
$('#'+parentId+' input[name=passNo]').val(newValues.passNo);
}

如果您想更改所有3个父母的输入，请说明输入名称，请使用：

$(input[name=passNo]').val(newValue)

3.如何制作它以便如果我更改任何输入'id'，它也会同时更改父ID？

如果您想要触发值更改的事件，请使用更改方法，如下所示：

$('#'+parentId+' input[name=passNo]').change(function(){
console.log('new value ' + $(this).val());
});

但我不建议更改DOM的ID。这是一种不好的做法。

5.我如何做到这一点，只有父id的'parent'部分跟随输入'id'的值？与parent_1一样，如果我将输入'id'的值更改为'john'，那么父ID将更改为'john_1'？

   $('#parent_1 input[name=name]').change(function(){
     var parentNode = $(this).closest('.parent-block');
     var newId = newId($(this).val(), parentNode); // this will return a new id.(you have to write it ofc:)) Because it is the subject of next point.
     parentNode.attr('id',newId );
     // you will need to add class 'parent-block' to your parents. Because your id will change you need to find a way to find your parent.
    });

当你处于onclick函数时，$（this）将是一个jQuery obj，用于单击对象，在你的case按钮中。所以使用jQuery函数来获取父级。我知道两种方式，父（）＆lt; -go到这个el父，或者最近（）＆lt; -goes到第一个节点（祖先）和给定的限定符，比如css类。

$（'button'）。on（'click'，function（））{ $（本）.parent（）父（）父（）删除（）。; $（这）.closest（ '父块'）除去（）; //您需要将一个类添加到父块：）

};

更改来自不同父级的多个同名输入

1 个答案: