我有以下 jQuery 源代码 (modalConnect()) 用于加载表单并通过 boostrap modal呈现它。它基本上阻止了 href 标记的默认行为,而是提交了一个 ajax get 调用。这工作正常。
现在我必须将另一个 .js 脚本标签添加到我从服务器接收的 dom 中。这也适用于第一次点击,对于每一次后续点击,该方法执行的次数是它已经执行的次数 + 1。这很奇怪。
因此,对于第一次单击,我会在控制台中收到以下信息:
执行的函数 执行的附加 JS
这很好。
对于第二次点击(相同或另一个 - 没有区别),我收到以下信息:
执行的函数 执行的附加 JS
执行的函数 执行的附加 JS
现在在控制台中总共打印了三次文本,而我只希望打印两次。
<script type="text/javascript">
function modalConnect()
{
$(".editItem").click(function(ev) { // for each edit item <a>
ev.preventDefault(); // prevent navigation
var url = ($(this)[0].href); //get the href from <a>
$.get(url, function(results){
var itemForm = $("#ajax_form_modal_result", results);
console.log("function executed");
//update the dom with the received results
$('#itemFormModal').html(itemForm);
//add a new js script to the document. Repeated method calling effect only occurs if I add the following two lines
scriptText = "console.log('Additional JS executed')";
appendScriptTag(scriptText);
//show a bootstrap modal with the loaded form
$("#itemFormModal").modal('show');
}, "html");
return false; // prevent the click propagation
})
}
</script>
自卫队
<script type="text/javascript">
function appendScriptTag(scriptText)
{
//create a script tag and append it to the dom
var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.text = scriptText;
//the following lines seem to have no effect.
//the "method called more often" effect is not influenced by these lines
document.body.appendChild(script);
document.body.removeChild(document.body.lastChild);
delete UnusedReferencedObjects; // replace UnusedReferencedObject with any object you created in the script you load.
}
</script>
此外,如果有人能解释我如何正确删除我用 appendScriptTag() 添加的最后一个 js 脚本标签,我会很高兴。我想我最终会包含多个 js,这实际上很糟糕。
不确定我在那里做的是否正确,我从这篇文章中遵循了 Hendra Uzia 的解释。