制作一个锚点切换函数，点击时将数据附加到文本区域，再点击时删除

make an anchor toggle function which appends data to textarea on click and removes on reclick

本文关键字：数据 删除 区域 文本 函数 一个      更新时间：2023-09-26

我正在尝试制作一个锚点切换函数，该函数在单击时将数据附加到文本区域，并在重新单击时删除数据。这是小提琴。

`

function btnsInit()
{
  var i, a = document.getElementById('btns').getElementsByTagName('a');
  for (i = 0; i < a.length; ++i) 
 {
     var str=document.getElementById('ta').value; 
     var index= str.indexOf(a[i]);
     if(index!=-1)
    {
    a[i].onclick = btnClick;
    }
     else
    {
    str.replace(a[i],"_");
        }
  }
}
function btnClick(e)
{ 
  document.getElementById('ta').value += this.firstChild.nodeValue + ',';
  xPreventDefault(e);
  return false;
}

`请尽快回复

这是新的js代码，您可以使用它-

<div id='btns'>
        <p>
            <!-- adding id to element, helps to maintain the list
            of element which have been clicked, and also helps in
             distinguishing between two elements have same text. 
            Dont forget to add href="#' or href="javascript:void(0)"
             else your page may refresh and form data will be lost -->
            <a id="a1" href='#'>category</a>
        </p>
        <p>
            <a id="a2" href='#'>url</a>
        </p>
    </div>
<textarea id='ta' rows='10' cols='20'></textarea></body>

Javascript-

window.onload = btnsInit;
var selected = {};//keeps list of selected links
function btnsInit() {
    var i, a = document.getElementById('btns').getElementsByTagName('a');
    for (i = 0; i < a.length; ++i) {
        a[i].onclick = btnClick;
    }
}
function btnClick(e) {
    if (selected[this.id]) {
        delete selected[this.id];//deleting if already been clicked
    } else {
        selected[this.id] = this.innerHTML;//adding to the selected list
    }
    updateTextArea();
    xPreventDefault(e);
    return false;
}
function updateTextArea() {
    var ta = document.getElementById('ta');
    var val = "";
    for ( var id in selected) {
        val += selected[id] + ",";
    }
    ta.value = val;//updating from selected list
}
function xPreventDefault(e) {
    if (e && e.preventDefault)
        e.preventDefault();
    else if (window.event)
        window.event.returnValue = false;
}

代码问题-

  • btnsInit实际上并没有将onclick侦听器分配给<a>元素
  • 未处理或未正确处理链接（如果已处理）
  • 将属性/值href=' '用于正在刷新页面的a标记

更新-评论中提出的问题

  • 我的代码在刷新页面时不起作用吗

    不，不是。它缺少重新点击处理，btnsInit工作不正常。

  • 删除是预定义的函数吗

    delete是一个JavaScript关键字，用于删除对象属性
    关于删除关键字

  • "this"有什么用

    this是另一个关键字，它保存上下文中对象的引用，在本例中，它保存单击的元素。关于这个关键词的更多信息

相关文章：