我如何传递链接锚文本

How do I pass the link anchor text

本文关键字：文本 链接 何传递      更新时间：2023-09-26

我是Javascript的新手，我问了我的几个Javascript朋友，他们似乎没有答案。我一直在PHP中开发一个简单的搜索查询，它输出几个结果，例如:

<a href="#" onclick="injectForm(this);">Result Text Here</a>
<a href="#" onclick="injectForm(this);">Result Text 2 Here</a>
<a href="#" onclick="injectForm(this);">Result Text 3 Here</a>

<form id="form1" name="form1" method="post" action="">
<label for="textfield"></label>
<input type="text" name="textfield" id="textfield" />Search
</form>

伪代码

  • 获取刚刚点击的链接的。value
  • 将其传递给变量，即result = (something something).value
  • form1.textfield设置。value = result

我想做的是有一个简单的injectForm()函数，读取结果"锚文本在这里"的值，所以当有人点击它-它下降的值"结果文本在这里"它进入"文本字段"的形式。我相信你可以用DOM做到这一点——我不想使用任何JS库，如Jquery。

有人有什么想法吗?如果我为每个href使用不同的DIV或SPAN标签，你可以使用DOM -我不想用不同的DIV或类编号每个结果，如果可能的话-只是阅读相对this();之类的

很简单

document.getElementById("injectDiv").addEventListener("click", function(e) {
  tgt = e.target;
  if (tgt.classList.contains("inject")) {
    e.preventDefault(); // cancel link
    document.getElementById("textfield").value = tgt.innerHTML;
  }
})
<div id="injectDiv">
  <a href="#" class="inject">Result Text 1 Here</a><br/>
  <a href="#" class="inject">Result Text 2 Here</a><br/>
  <a href="#" class="inject">Result Text 3 Here</a><br/></div>
<input type="text" id="textfield" />

旧内联版本

function injectForm(theLink) {
  document.getElementById("textfield").value = theLink.innerHTML;
  return false; // cancel the click
}
<a href="#" onclick="return injectForm(this);">Result Text 1 Here</a><br/>
<a href="#" onclick="return injectForm(this);">Result Text 2 Here</a><br/>
<a href="#" onclick="return injectForm(this);">Result Text 3 Here</a>
<br/>
<input type="text" id="textfield" />

相关文章：