Question

我正在尝试将鼠标悬停在某个元素上，检查该类是否包含前缀，如果是，请将一些样式应用于此元素。这个问题是，如果我有一个名为＆＃34; bluescript-contact-form＆＃34;的类的div（注意前缀＆＃34; bluescript - ＆＃34;）那么这样做当我将鼠标悬停在此div的子元素上时，不要开火。如何实现这一目标？

这是我到目前为止编写的代码：

var controls = {
  clickedElement: "",
  prefixCheck: function(c){
    // classPrefix = "bluescript-"
    return (c.indexOf(classPrefix) !== -1) ? true : false;
  },
  bindUIActions: (function(){
    $(outputElement).on("load", function(){
      $(outputElement).contents().find("*").on("click", function(e){
        e.stopImmediatePropagation();
      });
      $(outputElement).contents().find("*").mouseenter(function(e){
        e.stopImmediatePropagation();
        if(typeof $(this).attr("class") !== "undefined"){
          /* This works, but only on the current element. 
             It does not check if a parent contains a class,
             that contains a prefix that matches. */
          if(controls.prefixCheck($(this).attr("class"))){
            $(this).css({
              outline: onHoverBorder,
              cursor: "pointer"
            });
          }
          /* Else if( a parent contains a class that matches, 
             apply style to THIS parent element ) */
        }
      });
      $(outputElement).contents().find("*").mouseleave(function(e){
        $(this).css({
          outline: "none",
          cursor: "default"
        });
      });
    });
  })()

}

我希望这很清楚。任何帮助，将不胜感激。谢谢！

Answer 1

stopImmediatePropagation 阻止事件向上传播DOM树（它没有到达父树）。如果由于某种原因需要调用该方法，则可以将父节点的类作为 $（this）.parent（）。attr（＆＃34; class＆＃34;）。这段代码应该可以正常工作：

else if(controls.prefixCheck($(this).parent().attr("class"))){
    // Your code here
}

如果您需要更改类以逗号开头的所有祖先的样式，您应该使用 parents（）方法，请参阅：

else{
    $(this).parents().each(function(index,value){
        if(controls.prefixCheck($(this).attr("class"))){
            $(this).css({
                outline: "none",
                cursor: "default"
            });
        }
        // Uncomment the next line if you only want to change the first match found.
        // return false ;
    });
}

您应该使用 startsWith 来检查班级的前缀：

prefixCheck: function(c){
    // classPrefix = "bluescript-"
    return c.startsWith(classPrefix);
},

或正确使用 indexOf ：

prefixCheck: function(c){
    // classPrefix = "bluescript-"
    return c.indexOf(classPrefix) === 0;
},

否则你可能会得到误报。

检查父项是否有类，如果是，则将样式应用于此父项

1 个答案: