HTML

Question

很抱歉，如果涉及到带有HTML的Javascript，我就是一个非常棒的人。我正在尝试创建一个按钮，当选中多个复选框时，它会更改它的值。

实施例：如果选中一个复选框=按钮：删除1行如果选中了两个复选框=按钮：删除2行等

当我检查所有复选框时，我希望这会自动发生。唯一的问题是我不知道如何在一个按钮中调用它的值。

JS：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
    $('input[type="checkbox"]').click( function() {
        $("input[type=submit]").val("Delete "+$('input:checkbox:checked').length+" rows"); 
    });
</script>

HTML：

<input type="submit" name="submit" class="btn btn-success"  value="Verwijder" />

此（PHP）的服务器端确实有效（删除行）。感谢您的帮助和时间！

Answer 1

您可以使用此功能更改按钮的值

function change(val)
{
document.getElementById(12345).value=val;
}

创建按钮时会像id="12345" .....

那样给它一个id

Answer 2

您只需执行此操作即可收听复选框的点击事件，并通过获取$('input:checkbox:checked')

的长度来应用该值

jsfiddle：http://jsfiddle.net/spedwards/Ls8sp/

$('input[type="checkbox"]').click( function() {
   $("input[type=submit]").val("Delete "+$('input:checkbox:checked').length+" rows"); 
});

Answer 3

$('input[type="checkbox"]').on("click","input[type=checkbox]",function()
{
   $("input[type=submit]").val("Delete "+$('input:checkbox:checked').length+" rows"); 
});

Answer 4

使用jQuery，您可以更改脚本中元素的值。

$('input[type="checkbox"]').click(function(){
    if($(this).attr('checked')===true){
        i++;
    }
    else{
        i--;
    }
    $('input[type="submit"]').val("Delete "+i);
});

Answer 5

这样的事情

HTML

<form>
    <ul>    
        <li><input type="checkbox" />item one</li>
        <li><input type="checkbox" />item two</li>
        <li><input type="checkbox" />item three</li>
        <li><input type="checkbox" />item four</li>
        <li><input type="checkbox" />item five</li>
        <li><input type="checkbox" />item six</li>
        <li><input type="checkbox" />item seven</li>
        <li><input type="checkbox" />item eight</li>
        <li><input type="checkbox" />item nine</li>
        <li><input type="checkbox" />item ten</li>
    </ul>
    <input type="submit" value="Delete (0)" />
</form>

的jQuery

var getChecked = function($form) {
    return $form.find('input[type="checkbox"]:checked');
};

$form = $('form').on('submit', function(e) {
    e.preventDefault();
    getChecked($form).each(function() {
        $(this).parent().remove();
    });
});

$form.find('input[type="checkbox"]').on('change', function(e) {
    $form.find('input[type="submit"]').val('Delete (' + getChecked($form).length + ')');
});

查看实时fiddle

按钮值通过JS更改

5 个答案:

HTML

的jQuery