单击“更改css”

onclick change css

本文关键字：css 更改 单击      更新时间：2023-09-26

我在PHP做一个简单的日历应用程序，我想改变<td>块风格取决于用户做什么。但是我希望当"menuclick"类打开时，其他类停止工作，直到我单击另一个块。前一个块也应该关闭。提前谢谢。

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

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

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

HTML: 

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

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

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

我认为你可以使用以下方法实现你想要的:

echo '<td onclick="this.className=''menuclick'';" onmouseover="this.className=''menuon'';" onmouseout="this.className=''menuoff'';">'
http://jsfiddle.net/WDu9v/

似乎每个人都在给出jquery的答案，而jbaby却在抱怨内联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/

相关文章：