Question

我在java脚本和html dom中引用了一个大问题。我想只使用双引号（＆＃34;），而不是＆＃39;一点都没有！这是我的代码：

<a onclick="aClicked("<span onclick="spanClicked("You clicked me")">I'm an Span</span>")">Add span</a>

<script type="text/javascript">
function aClicked(str) {
    $(document).append(str);
}
function spanClicked(str) {
    alert(str);
}
</script>

任何人都可以帮助抛出这些问题！？罐。

这是我的原始代码（它工作正常，但我只是想简化它并且不感兴趣）：＆＃34;我用ajax＆＃34;

调用此函数

<?php
function getTags() {
        $values = ['test1', 'test2'];
        $valuesString = '';
        $baseSpanString = '<span><span class="tag">?</span><a onclick="Tags.Update($(this).parent().parent(), $(this).parent(), &quot;tag&quot;);">x</a></span>';
        foreach ($values as $tmpValue) {
            if(trim($tmpValue) == '') {
                continue;
            }
            $valuesString .= str_replace('?', $tmpValue, $baseSpanString);
        }

        $xhtml = '
                <div>
                    <input type="text" onkeydown="return Tags.Insert($(this).parent(), $(this), event, \''.str_replace('"', '\\\'', $baseSpanString).'\', \'tag\');"/>
                    <textarea style="display:none;">'.implode('-', $values).'</textarea>
                    '.$valuesString.'
                </div>
        ';

        return $xhtml;  
}
?>  

<script type="text/javascript">

Tags = {};
Tags.Update = function(div, span, tagClass) {
    div = $(div);
    if(!div.length) {
        alert('Error');
        return false;
    }
    $(span).remove();
    var tagsSpan = $('.'+tagClass, div);
    var tagsString = [];
    if(tagsSpan.length) {
        $.each(tagsSpan, function(index, val) {
            tagsString.push($(val).text());
        });
    }
    $('textarea', div).text(tagsString.join('-'));
};
Tags.Insert = function(div, input, event, baseSpanString, tagClass) {
    if (event.keyCode == 13)
    {
        div = $(div);
        input = $(input);
        if(!div.length || !input.length) {
            alert('Error');
            return false;
        }
        var val = input.val();
        if(val && val != '') {
            input.val('');
            var spanString = baseSpanString.replace('?', val);
            div.append(spanString);
        }
        var tagsSpan = $('.'+tagClass, div);
        var tagsString = [];
        if(tagsSpan.length) {
            $.each(tagsSpan, function(index, val) {
                tagsString.push($(val).text());
            });
        }
        $('textarea', div).text(tagsString.join('-'));
        return false;
    }
};

</script>

Answer 1

两个答案：

您的字符串问题
正确的方式

您的字符串问题

'是专门为此设计的功能。但有时候这些东西合法地出现了......

关键是要了解您在每个阶段处理的文本类型：

在属性（"）的onclick="..."内，您正在编写HTML文本，即使您在该HTML文本中撰写的内容是JavaScript。因此，如果您坚持不使用"，则可以使用'作为报价。
如果您需要在JavaScript代码中使用字符串（例如我们传递onclick字符串中的aClicked）并坚持不使用' }，在\之前加"。
如果您需要在HTML字符串中的HTML字符串中使用引号（例如传递给spanClicked的字符串，这是HTML字符串内的JavaScript字符串中的HTML字符串），然后你需要在处理完第一个HTML字符串中的实体后最终成为"的东西。这就是&quot;

所以：

<a onclick="aClicked(&quot;<span onclick=\&quot;spanClicked(&amp;quot;You clicked me&amp;quot;)\&quot;>I'm an Span</span>&quot;)">Add span</a>

示例：

＆＃13;

function aClicked(str) {
    $(document.body).append(str);
}
function spanClicked(str) {
    alert(str);
}

＆＃13;

<a onclick="aClicked(&quot;<span onclick=\&quot;spanClicked(&amp;quot;You clicked me&amp;quot;)\&quot;>I'm an Span</span>&quot;)">Add span</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

正确的方式

但同样，这只是让你的代码变得难以维护的一种方式;相反，只需使用jQuery，因为您已经在使用jQuery：

示例：

＆＃13;

$("a").on("click", function() {
    var span = $("<span>I'm a span</span>");
    span.on("click", function() {
      spanClicked("You clicked me");
    });
    $(document.body).append(span);
});
function spanClicked(str) {
    alert(str);
}

＆＃13;

<a>Add span</a>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

当您使用jQuery时，使用不显眼的事件处理程序，可以使用此.on()方法。动态生成元素时，您需要使用Event Delegation。

我还建议您使用语义正确的元素，因此使用<button>元素

$("#addSpan").on("click", function() {
  $('#container').append("<span class=\"myspan\">I'm an Span</span><br/>");
})

$("#container").on("click", ".myspan", function() {
  console.log("You clicked me");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" id="addSpan">Add span</button>
<div id="container">
</div>

Answer 3

最好把它变成像这样的函数

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a onclick="adds();">Add span</a>

<script type="text/javascript">
function adds(){
  aClicked("<span onclick='spanClicked(\"You clicked me\")'>I'm an Span</span>");
}
function aClicked(str) {
    
    $(document.body).append(str);
}
function spanClicked(str) {
    alert(str);
}
</script>

＆＃13;

javascript和html中的嵌套引号

3 个答案:

您的字符串问题

正确的方式