Question

＆＃13;

$('.txtags').keyup(function (event) {
	var el = $(this).val().split("\n").pop().toUpperCase();
	el = el.trim();
	$('.poptag').hide();
	$('.poptag').each(function(){
		if ($(this).text().indexOf(el) > -1) {
			$(this).show();
		}
	});
});

$('.poptag').click(function(){
	var a = $(this).text();
	var content = $('.txtags').val();
	var el = content.split("\n").pop();
	el = el.trim();
	content = content.replace(el, '') + a + "\n";
	$('.txtags').val(content);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class='txtags' id='tagsart' rows="5"></textarea>

<div class='poptags' id='poptags'>
<div class='poptag'>2019</div>
<div class='poptag'>ABCPLUS</div>
<div class='poptag'>LOREM</div>
<div class='poptag'>LOREM IPSUM</div>
</div>

＆＃13;

$('.txtags').keyup(function (event) {
    var el = $(this).val().split("\n").pop().toUpperCase();
    el = el.trim();
    $('.poptag').hide();
    $('.poptag').each(function(){
        if ($(this).text().indexOf(el) > -1) {
            $(this).show();
        }
    });
});

以上工作正常。现在我有以下内容：

$('.poptag').click(function(){
    var a = $(this).text();
    var content = $('.txtags').val();
    var el = content.split("\n").pop();
    el = el.trim();
    content = content.replace(el, '') + a + "\n";
    $('.txtags').val(content);
});

这也有效，但在点击poptag后 - 上一段代码（txtags keyup） - deosn＆not tt work！

Answer 1

问题是当你在文本框中输入时，你没有引入新的行字符“\ n”。所以它按预期工作正常

但是当你通过点击poptags填充文本框时，你会在文本框中引入新的行字符“\ n”。现在你必须在你的逻辑中处理这个新角色。

将您的txtags点击处理函数更改为以下代码。它应该工作。

$('.txtags').keyup(function (event) {
var el = $(this).val().split("\n");
var lastEl = el.pop();
if(lastEl=="" && el.length){
    el=el.pop().toUpperCase();
}else{
    el = lastEl.toUpperCase();
}
el = el.trim();
$('.poptag').hide();
$('.poptag').each(function(){
    if ($(this).text().indexOf(el) > -1) {
        $(this).show();
    }
});
});

Answer 2

问题在于你的逻辑

 $('.txtags').keyup(function (event) {
      var el = $(this).val().split("\n").pop().toUpperCase();
      el = el.trim();
      $('.poptag').hide();
      $('.poptag').each(function(){
        if ($(this).text().indexOf(el) > -1) {
          $(this).show();
        }
      });
    });

如果用户点击说“2019”，它将被添加到文本区域。

现在，如果用户在其旁边键入内容，则说“2019F”el将为null，因为您的分割（“\ n”）返回["2019F", ""]然后您在其上调用pop（）然后它变为{{1}然后当你调用返回0的""时，if语句0＆gt; -1将为真，因此poptags将再次显示。

我不能建议任何解决方案，因为我不完全理解你在这里要完成的任务，问题是你的逻辑，所以它应该很容易改变。

一个代码块阻止另一个代码工作

2 个答案: