onclick更改css [关闭]答案

【问题标题】：onclick change css [closed]onclick更改css [关闭]
【发布时间】：2013-03-06 19:15:42
【问题描述】：

我正在用 PHP 制作一个简单的日历应用程序，我想根据用户的操作更改 <td> 块样式。但是我希望当“menuclick”类打开时，其他类停止工作，直到我单击另一个块。前一个块也应该关闭。提前致谢。

echo'<td onclick=className="menuclick"; onmouseover=className="menuon"; onmouseout=className="menuoff";>' . $countDay++ . "</td>"

【问题讨论】：

您需要澄清您的问题和代码。我不明白你想要实现什么，而且你的代码看起来不像是有效的 HTML。

标签： php javascript html css class

【解决方案1】：

我认为您可以使用以下方法实现您想要的：

echo '<td onclick="this.className=\'menuclick\';" onmouseover="this.className=\'menuon\';" onmouseout="this.className=\'menuoff\';">'

http://jsfiddle.net/WDu9v/

好像每个人都在给出 jquery 答案，而 jbabey 却在抱怨内联 js：

$('td').each(function() {
    $(this).mouseenter(function() {
        $(this).removeClass().addClass('menuon');
    });
    $(this).mouseleave(function() {
        $(this).removeClass().addClass('menuoff');
    });
    $(this).click(function() {
        $(this).removeClass().addClass('menuclick');
    }); 
});

http://jsfiddle.net/WDu9v/1/

【讨论】：

内联事件处理程序不是好的做法。
我只是用他给出的答案来回答这个问题 - 我会走 jquery 路线，但由于没有标记，所以你不能给出那种类型的答案

【解决方案2】：

我们来看看http://api.jquery.com/addClass/

  $("#menuItemId").addClass(function(index, currentClass) {
    var addedClass;

    if ( currentClass === "menuon" ) {
      addedClass = "menuoff";

      alert("menu has class "+addedClass+" now");

    }

    return addedClass;
  });

如果你想删除一个类或某个“状态”：http://api.jquery.com/removeClass/

希望这会有所帮助。

【讨论】：

【解决方案3】：

好吧，如果你想内联，那就有点复杂了。我宁愿使用 jQuery 并做这样的事情：

HTML：

<td class="menuClickable">Whatever...</td>

Javascript：

$(document).load(function() {
    $('.menuClickable').click(function() {
        $(this).removeClass('menuon');
        $(this).addClass('menuClick');
    });
});

当然，这只是又快又脏的版本……

【讨论】：