0

我有两个功能，用于按类显示和隐藏元素：

if (typeof showClass != 'function') {
    function showClass(trClass, buttonId, hideMessage, showMessage) {
        var button = '#' + buttonId;
        var value = hideMessage;
        $(button).attr("value", value);
        $(button).attr("onclick", "hideClass('" + trClass + "', '" + buttonId + "', '" + showMessage + "', '" + hideMessage + ");");
        var classToShow = '.' + trClass;
        $(classToShow).css('visibility', 'visible');
    }
}

if (typeof hideClass != 'function') {
    function hideClass(trClass, buttonId, showMessage, hideMessage) {
        var button = '#' + buttonId;
        var value = showMessage;
        $(button).attr("value", value);
        $(button).attr("onclick", "showClass('" + trClass + "', '" + buttonId + "', '" + hideMessage + "', '" + showMessage + ");");
        var classToHide = '.' + trClass;
        $(classToHide).css('visibility', 'hidden');
    }
}

showClass 作为例外工作，但 hideClass 在 Chrome 中导致错误“Unexpected token ILLEGAL”。使用 FireFox 我没有收到任何错误，但该功能不适用于任何一种浏览器。我尝试使用不同的编辑器来查找一些非法字符等，但没有运气。这可能是什么原因？

4

1 回答 1

0

您显然是在尝试设置一个切换按钮，但这是我见过的最复杂的 jQuery 和内联事件处理程序。

尝试这个：

function setupToggle(trigger, target, hideMessage, showMessage) {
    var state = false;      // true means button says "show", target is hidden
    var $el = $(trigger);

    function update() {
        $el.attr('value', state ? showMessage : hideMessage);
        $(target).css('visibility', state ? 'hidden' : 'visible');
    }

    update();  // set initial state

    $el.on('click', function() {
        state = !state;   // on click, flick state and refresh
        update();
    });
}

用法：

setupToggle('#mybutton', '.mytr', 'Hide it', 'Show it');

上面的代码可能需要根据默认状态是“隐藏”还是“显示”进行微调。

于 2013-10-17T11:20:36.603 回答