onclick有两个功能.只有第一个函数有效

onclick with 2 functions. only first function works

本文关键字:第一个 有效 功能 函数 onclick 两个      更新时间:2023-09-26

这个javascript工作起来没有问题。隐藏和显示表中的列。

<input id="toggle" type="button" value="Toggle Search"/>
$(function () {
    $('#toggle').click(function () {
       $('#searchtd').toggle();
    });
});

但是,我也希望能够更改切换按钮上的标题。

<input id="toggle" type="button" value="Hide Search"/>
$(function () {
    $('#toggle').click(function () {
        $('#searchtd').toggle()
        (this).text(function (i, v) {
            return v === 'Hide Search' ? "Show Search" : 'Hide Search';
        })
     });
});

在这种情况下,表中的列将隐藏并显示,但标题不会更改。。。

要更改按钮的值,请使用.val(),而不是.text():

$(function () {
    $('#toggle').click(function () {
        $('#searchtd').toggle();
        $(this).val(function (i, v) {
            return v === 'Hide Search' ? "Show Search" : 'Hide Search';
        })
    });
});

演示

    $(function() {
         $('#toggle').click(function() {
                var $currentBtn = $(this);
                $('#searchtd').toggle();
                var newText = $currentBtn.attr('value') === 'Hide Search' ? "Show Search" : 'Hide Search';
                $currentBtn.attr('value', newText)
           });
    });
相关文章: