如何保持无线电元素的价值

时间:2017-04-25 15:54:28

标签: javascript jquery html

已解决:

我使用jQuery允许用户动态地向表单添加字段,我要求他们选择某些是和否值。当我克隆行时,我需要将值保留在输入无线电元素上,而不是文本元素上。我期待这样做但没有运气。

我如何保留无线电元素的值?

此外,当前一节点选择了无线电时,克隆会复制选择信息。我不希望这种情况发生。

HTML:

<div class="dynamic-node">
    <input type="text" name="custom-name[0]" value=""/>
        <hr>
    <input type="radio" name="haswood[0]" value="yes"/>Yes
    <input type="radio" name="haswood[0]" value="no"/>No
        <hr>
    <input type="radio" name="hasmetal[0]" value="yes"/>Yes
    <input type="radio" name="hasmetal[0]" value="no"/>No
        <hr>
    <input type="radio" name="hasplastic[0]" value="yes"/>Yes
    <input type="radio" name="hasplastic[0]" value="no"/>No
</div>

<div class="clone-node">Add Row</div>

JQuery的:

$cloneNode = $( ".clone-node" );

$cloneNode.click(function(){
    var $newNode = $(".dynamic-node:last").clone(true);
    $newNode.find('input').each(function() {
        var $this = $(this);
        $this.attr('name', $this.attr('name').replace(/\[(\d+)\]/, function($0, $1) {
            return '[' + (+$1 + 1) + ']';
        }));
        $this.val('');
    });
    $newNode.insertAfter('.dynamic-node:last');
});

解决方案:

感谢下面的评论者并借用他们新鲜的眼睛,我通过扩展代码并根据其类型和需求调整元素来解决这个问题:

$cloneNode = $( ".clone-node" );

$cloneNode.click(function(){
    var $newNode = $(".dynamic-node:last").clone(true);
    $newNode.find('input').each(function() {
        var $this = $(this);
        $this.attr('name', $this.attr('name').replace(/\[(\d+)\]/, function($0, $1) {
            return '[' + (+$1 + 1) + ']';
        }));

        if( $this.is('input:text') ) {
            $this.val('');
        }
        if( $this.is('input:radio') ) {
            $this.prop('checked', false);
        }
    });
    $newNode.insertAfter('.dynamic-node:last');
});

0 个答案:

没有答案