Javascript 如果条件为not，则在中使用.hasClass（）会起作用

我有一个div，当用户将鼠标悬停在上面时，它将插入一个div

child

div。 但问题是每次悬停时，它都会重复添加相同的div。因此，我尝试了下面的脚本来检查

child

div是否在

MotherDiv

中可用。否则，添加

子类

div。这些都发生在悬停状态。那么，下面的代码有什么问题

我错过什么了吗

if ($('.MotherDiv').hasClass('Child'))
{
alert('alerady a div there!');//DO NOTHING
}
else 
 {        
 var Details= "<div class='MotherDiv'><table class='Special'><tr><td>Offers</td></tr><tr><td>CheckOut Now</td></tr></table></div>";
  $(Child).insertAfter($(this));//This is insert the child div on hover
}

if（$（'.MotherDiv'）.hasClass（'Child'））
{
警惕（'alerady a div那里！'）；//什么也不做
}
其他的
{        
var Details=“OffersCheckOut Now”；
$（Child）.insertAfter（$（this））；//这是在悬停时插入子div
}

上面显示的JavaScript snipplet无效。你不能让它像那样断线

您可以在行的末尾添加一个

\

，以表示它是继续的，但这通常被认为是一种不好的做法

if ($('.MotherDiv').hasClass('Child')) {
    alert('alerady a div there!');//DO NOTHING
} else {        
    var Details= "<div class='MotherDiv'>\
       <table class='Special'>\
       <tr><td>Offers</td></tr>\
       <tr><td>CheckOut Now</td></tr>\
       </table>\
       </div>";
    $(Child).insertAfter($(this));//This is insert the child div on hover
}

if（$（'.MotherDiv'）.hasClass（'Child'））{
警惕（'alerady a div那里！'）；//什么也不做
}否则{
变量详细信息=”\
\
提议\
现在结账\
\
";
$（Child）.insertAfter（$（this））；//这是在悬停时插入子div
}

---

注意，

\

后面不能有任何字符，否则会出错。

文档中添加的

.MotherDiv

在哪里？您似乎没有插入

$（详细信息）

问题可能是您的字符串跨越多行。
JavaScript不会以这种方式处理字符串。您需要将字符串拆分为多个部分并将它们连接起来，或者使用行终止转义来保留换行符和后面的空格

var Details= "<div class='MotherDiv'>
 <table class='Special'>
   <tr><td>Offers</td></tr>
   <tr><td>CheckOut Now</td></tr>
 </table>
 </div>";

var详细信息=”
提供
现在结账
";

致：

var Details=“”
+ ""
+“报价”
+“立即结账”
+ "
+ "";

或：

var详细信息=”\
\
提议\
现在结账\
\
";

假设这是要生成的HTML结构：

<div class="Mother">
    Mother Div Content
    <div class="Child">
        Child Div to be generated dynamically
    </div>
</div>

母Div内容
要动态生成的子Div

jQuery脚本：

$(".Mother").hover(function(){
    var motherDiv = $(this);
    if(motherDiv.find(".Child").length == 0) {
        var childDiv = $("<div class='Child'>Child Div Content</div>");
        motherDiv.append(childDiv);
    }
});

$（“.Mother”）.hover（函数（）{
var motherDiv=$（这个）；
if（motherDiv.find（“.Child”）.length==0）{
var childDiv=$（“子Div内容”）；
motherDiv.append（childDiv）；
}
});

您正在寻找类似的内容。如果div没有，只需添加新的子类。如果需要在母div中添加新的子div，则只需稍微自定义代码

$（函数（）{
var$motherDiv=$（'.motherDiv'）；
$motherDiv.bind（'mouseenter'，
函数（）{
if（$motherDiv.find（'.ChildDiv'）。长度==0）{
$（''，{class:'ChildDiv'，text:'childdata text'}）.appendTo（$motherDiv）；
}
});});

我认为这里发生的事情远不止这些。这应该是一个评论，或者至少你应该说明如何解决这个问题。无论如何，你可以用一个“\`来避开这一行，暗示回车。（我刚刚意识到我不知道如何避开。有人吗？）@Ohgodwhy:没关系，那没用。@minitech非常感谢。这个“Child”css类添加到哪里了？也许你应该检查它是否有子类，而不是寻找一个类？你是否将代码放在悬停函数中？你在哪里使用

详细信息
变量？也许我没有得到问题，但它似乎是你的问题描述和您的代码是矛盾的。根据您的描述，
Motherdiv
应该已经在DOM中，您只想动态添加
Child
div，是吗？是的，如果
Child
div存在，如果
Motherdiv
没有child div我们需要添加的不是解决方案，而是评论。-1+1，不确定你为什么被否决，只是缺少对问题的描述。
<div class="Mother">
    Mother Div Content
    <div class="Child">
        Child Div to be generated dynamically
    </div>
</div>

$(".Mother").hover(function(){
    var motherDiv = $(this);
    if(motherDiv.find(".Child").length == 0) {
        var childDiv = $("<div class='Child'>Child Div Content</div>");
        motherDiv.append(childDiv);
    }
});

$(function(){
    var $motherDiv=$('.MotherDiv');
    $motherDiv.bind('mouseenter',
    function(){
        if($motherDiv.find('.ChildDiv').length==0){
            $('<div></div>',{class:'ChildDiv',text:'Child Data Text'}).appendTo($motherDiv);
        }
    });});