Question

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

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

Answer 1

我们来看看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/

希望这有帮助。

Answer 2

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

HTML：

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

使用Javascript：

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

当然，这只是快速＆amp;脏版......

Answer 3

我认为您可以使用以下内容实现您想要的目标：

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/

onclick改变css

3 个答案: