0

我经常遇到一个问题，我习惯于getElementById填充 div 或 span 元素，通常是通过服务器中的 Ajax。但是，我希望用户能够做一些简单的事情来清空 div 并返回到以前的页面方式。例如，单击页面上的其他位置。我一直在使用一个小折叠图标，单击该图标会重新加载页面，但这显然不是最佳解决方案。

任何人都可以提出一个简单的方法来清除 div。我有一种预感，就是要找到合适的处理程序，但我对处理程序知之甚少。如果这可以在同一个脚本中，那就太好了，但欢迎任何方法。

现在，这已经提出了一个脚本，可以抓取选择并使用它进行搜索。如果结果没有用，我想让用户单击并清空 div。然而，这个问题真的一直都在出现。这是我现在正在处理的缩写代码......

JS

function getSelection() {
  var sel = getSelection();
  if (sel=""){
    alert("Please select text");
  } else {
    //grab selection and search on it using Ajax
    //code for browsers...
    xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById('searchresults').textContent=xmlhttp.responseText;
      }
    }
    xmlhttp.open("GET","search.php?q="+sel,true);
    xmlhttp.send();
  }
}

HTML

<a href="javascript:void(0)" onclick="getSelection()">click</a>
4

4 回答 4

2

你为什么不使用

document.getElementById('searchresults').textContent="";

如果你有 jquery，那么

$("#searchresults").empty();
于 2012-12-22T11:22:37.850 回答
1

您拥有执行此操作的所有要素。getSelection您的功能的衍生产品：

var clear = function(){
  document.getElementById('searchresults').textContent = "";
};


<a href="javascript:void(0)" onclick="clear()">clear</a>

注意：一个谦虚的建议：你应该从添加内联 JS 到绑定事件处理程序中毕业。

当检测到外部点击时清除内容的一种方法searchresults可以通过停止在下生成searchresults的任何事件的传播来完成。但是，对于.clicksearchresultsdocumentclicksearchresults

var searchresults = document.getElementById("searchresults")​;
var stop = function(evt){
    evt.stopPropagation();
};
var clear = function(){
    searchresults.innerHTML = "";
};
searchresults.addEventListener("click", stop, false);
document.addEventListener("click", clear, false);

要实现这一点，您需要使用addEventListener（和attachEvent，它的 IE 对应物。）

于 2012-12-22T11:25:26.410 回答
0

如果我正在阅读此内容，然后询问您一次只想清除一个 div，您可以存储元素的 id，然后当用户单击其他地方时，从存储的 id 中获取元素并清空 textContent。我希望这就是你要找的我可能误解了这个问题。

于 2012-12-22T11:24:55.263 回答
0

您可以使用类似...的方式删除所有后代节点

var parentNode = document.getElementById('searchresults');

while (parentNode.hasChildNodes()) {
    parentNode.removeChild(parentNode.firstChild);
}

当然，使用 jQuery 会更简单...

$("#searchresults").empty()
于 2012-12-22T11:39:11.640 回答