将outerHTML视为jQuery对象

时间:2017-06-07 16:51:26

标签: javascript jquery dom

我试图只创建2个简单的框,并允许用户从1个框中选择数据,然后将其复制到第二个框。如果第二个框中已经存在相同的文本,请在后面添加一些简单的文本。

当项目不在第二个框中时,它基本上有效。但是,如果是,我无法在文本中附加数据。

这是一个简单的例子。

https://jsfiddle.net/9mbgw20e/5/

<div id="inventory">
  <div class='item'>
    <span>Apple</span>
  </div>
  <div class='item'>
    <span>Pear</span>
  </div>
</div>
<hr>
<div id="selected">

</div>


// bring the items from inventory to selected
// if selected is found, add some text to the back of it

$('.item').on('click', function() {
  var h = $(this)[0].outerHTML;

  var found = false;
  var foundId = '';
  if ($('#selected').children().length < 1) {
    // if there's nothing selected, just straight add this
    return $('#selected').prepend(h);
  }

  $('#selected').children().each(function() {
    if ($(this).find('span').text() == $(h).find('span').text()) { // if there is already one in selected div
      console.log('Found duplicated.');
      found = true;
      foundId = $(this)[0].outerHTML;
    }
  });

  if (!found) {
    // if item is not in selected div, add
    $('#selected').prepend(h);
  } else {
    // if item is in selected div, add some text to it
    $(foundId).append('1, ');
  }
});

第一次点击有效,但第二次点击后,没有任何反应。

2 个答案:

答案 0 :(得分:1)

将foundID更改为此foundId = $(this);

https://github.com/GoogleCloudPlatform/golang-samples/issues/266

答案 1 :(得分:0)

请尝试使用QAbstractNativeEventFilter方法:

foundId = $(this).first();

first()