0

我在点击一个表单按钮时重新执行导入的 js 文件,该按钮调用一个函数将 DOM 元素插入页面(模拟 ajx 回调函数的 exe)。DOM 插入会导致页面刷新,重新请求服务器的所有文件。

函数调用没什么大不了的:

var addFashionVideo = function() {

var nodeContainer = document.getElementById('vidList');
var mytitle = document.forms.addVideo.newVidName.value;
var addTextNode = document.createTextNode(mytitle);
var newLI = document.createElement('LI');
newLI.appendChild(addTextNode);
nodeContainer.appendChild(newLI);

return this;

};

DOM 更新代码的目标 DIV 是:

<div id="ajParent" class="aj" style="width:325px;background-color:blue;color:white;">

<ul id="vidList">
<li><a href="javascript://" title="FashVid-Paris">Watch Fashion Paris Video</a></li>
</ul>

</div>

我在此页面上放置了一个警报,在函数尝试插入新的 LI [奇怪的是,LI 出现一瞬间然后消失] 后,页面刷新被触发,我在页面上的警报重新执行。

// 也许我在这台计算机上遇到了浏览器问题,或者我只是一个新的脚本编写者 // 看不到问题...任何评论表示赞赏。

4

1 回答 1

0

您在表单上点击提交的那一刻,页面将重新加载,因为您已使用表单发出 GET 请求。为了阻止表单提交,您必须使其在提交时返回 false。例如

document.getElementById('formname').onsubmit = function {
  return false; 
};

您必须确保禁用表单提交以便页面不会重新加载,然后您可以在提交时运行您的 ajax 请求,并在 ajax 函数中成功执行您必须执行的操作。

我真的怀疑你的 dom 插入会导致重新加载。

于 2015-01-24T07:09:32.303 回答