1

我正在使用 jscript 插入 HTML。

function pluginOrderTotals(OrderTotals) {
var orderTotalsHTML = "";
if (OrderTotals != "") {
    orderTotalsHTML = "<a id='OrderTotals' href=''>Order Totals</a><p id='OrderTotalText'>" + OrderTotals + "</p><script>$('#OrderTotals').click(function () {          $('#OrderTotalText').toggle('fast');});";
}
document.getElementById("pluginWidgets2Div").innerHTML = orderTotalsHTML;}

变量的 HTML 部分传递得很好，但 JQuery 动画不起作用。如果我像下面这样在 HTML 中硬编码，动画效果很好。

    <div id="pluginWidgets2Div">
        <a id="OrderTotals" href="">Order Totals</a>
            <p id="OrderTotalText">Hiya<br />
            Such interesting text, eh?</p>
        <a id="FreightView" href="">View Freight</a>
            <p id="FreightViewText" style="display: none">Hiya<br />
            Such interesting text, eh?</p>
        <a href="">Another (3)</a>
        <a href="">Menu item 4</a>
        <a href="">One more (5)</a>
        <script>
        $("#OrderTotals").click(function () {
        $("#OrderTotalText").toggle("fast");
        });
        $("#FreightView").click(function () {
        $("#FreightViewText").toggle("fast");
        });
        </script></div>

谢谢你的帮助。

4

3 回答 3

4

.innerHTML不执行脚本元素。您可以.html()在 jQuery 中使用...

或者做直接运行该代码的明智之举：

function pluginOrderTotals(OrderTotals) {
    var orderTotalsHTML = "";
    if (OrderTotals != "") {
        orderTotalsHTML = "<a id='OrderTotals' href=''>Order Totals</a><p id='OrderTotalText'>" + OrderTotals + "</p>";
    }
    document.getElementById("pluginWidgets2Div").innerHTML = orderTotalsHTML;
    $('#OrderTotals').click(function () {
        $('#OrderTotalText').toggle('fast');
    });
}
于 2012-06-07T15:08:10.853 回答
1

有一个很好的不显眼的方法可以让这个代码在机翼中等待，这样它就可以工作了。插入 HTML 时，跳过 JavaScript - 单独处理。

function pluginOrderTotals(OrderTotals) {
    var orderTotalsHTML = "";
    if (OrderTotals != "") {
    orderTotalsHTML = "<a id='OrderTotals' href=''>Order Totals</a><p id='OrderTotalText'>" + OrderTotals + "</p>";
    }
document.getElementById("pluginWidgets2Div").innerHTML = orderTotalsHTML;
}

$(document).ready(function(){
    $("#pluginWidgets2Div").on("click", "#OrderTotals", function () {
        $("#OrderTotalText").toggle("fast");
    });
});

如果/当它被插入，jQuery 将应用于 HTML，并且您的 HTML 不需要在其中包含任何 JavaScript。

于 2012-06-07T15:14:28.583 回答
0

您还没有关闭<script>标签：

orderTotalsHTML = "<a id='OrderTotals' href='#'>Order Totals</a><p id='OrderTotalText'>" + OrderTotals + "</p><script>$('#OrderTotals').click(function () {  $('#OrderTotalText').toggle('fast');});</script>";
于 2012-06-07T15:08:02.723 回答