Question

我想要实现的不是输入<a href="#">Text Inside</a> a id中的文字，而是要输入a id。例如，如果使用1 <script type="text/javascript"> $(function() { $('.tags_select a').click(function() { var value = $(this).text(); var input = $('#text_tag_input'); input.val(input.val() + value + ', '); return false; }); }); </script> <input id="text_tag_input" type="text" name="tags" /> <div class="tags_select"> <a id="1" href="#">text1</a> <a id="2" href="#">text2</a> <a id="3" href="#">text3</a> </div>点击第一个链接。然后将1输入到文本字段中。

each_with_index

Answer 1

您发布的代码几乎与此功能相同，您只需检索id而不是文本：

$(function() {
    $('.tags_select a').click(function() {

        // this.id retrieves the id attribute/property value
        // of the 'this' element (here the clicked <a> element:
        var value = this.id;
        var input = $('#text_tag_input');
        input.val(input.val() + value + ', ');
        return false;
    });
});

虽然上述方法有效，但我建议稍微整理一下：

$(function() {
    $('.tags_select a').click(function() {
        var clicked = this;

        // here we select the relevant element to
        // which we want to add the new data. To
        // do that we use the anonymous function
        // of the val() method:
        $('#text_tag_input').val(function(i,v){
          // i: the index of the current (only)
          //    element in the collection returned
          //    in the jQuery collection.
          // v: the current value held in the
          //    element.

          // here we add the 'clicked.id' (id of
          // the clicked element, cached outside
          // of this method call) to the existing
          // value ('v') and and also add the ', '
          // String to that value:
          return v += clicked.id + ', ';
        });
        return false;
    });
});

你也可以用简单的JavaScript来相对容易地做同样的事情：

// a named function to act as the event-handler:
function addToElementText() {

  // 'this' is the element/node passed automatically
  // from the EventTarget.addEventListener() method
  // and in this example will be the <a> element:
  var clicked = this;

    // here we use document.querySelector() to retrieve
    // the first - if any - element matching the given
    // selector:
    document.querySelector(

      // we retrieve the selector held in the clicked
      // element's 'data-selector' attribute, retrieved
      // via the Element.dataset object:
      clicked.dataset.selector

    // then we update the value of that element via
    // its value property, retrieving the required
    // value-to-add from the property of the clicked
    // element:
    ).value += clicked[

      // retrieving the property to be used from the
      // data-property attribute of the clicked
      // element, using the same dataset API as
      // above:
      clicked.dataset.property

    // and also adding the ', ' string:
    ] + ', ';

}

// retrieving all the elements to which the event-handler
// should be bound, using a CSS selector:
var links = document.querySelectorAll('.tags_select a');

// creating an Array from the NodeList of elements returned
// by document.querySelectorAll():
Array.prototype.slice.call(links)

  // iterating over that Array of elements using
  // Array.prototype.forEach():
  .forEach(function(link) {
    // 'link': a reference to the current Array element
    // of the Array over which we're iterating.

    // here we bind the named function, addToElementText(),
    // (note the absence of parentheses below) to handle
    // the 'click' event on the link:
    link.addEventListener('click', addToElementText);
  });

上述JavaScript要求<a>元素有一个附加属性来传达所选属性应添加到的元素所需的选择器，另一个属性用于选择要添加的相关属性值：

<a href="#" id="1" data-selector="#text_tag_input" data-property="id">link text</a>

Answer 2

$（this）.attr（'id'）而不是$（this）.text（）

这是代码（jquery）：

public RootObject OrdersChange

你也可以使用平面js

 $(function() {
            $('.tags_select a').click(function() {
                var value = $(this).attr('id');
                var input = $('#text_tag_input');
                input.val(input.val() + value + ', ');
                return false;
      });
    });

Answer 3

改变这个：

var value = $(this).text();

到此：

var value = $(this).attr('id');

点击输入id到输入字段

3 个答案: