html Li标签中的textarea标签无法获得焦点。

Question

1.用jquery写一个问卷，有一道题是如果选了这道题的某个选项 那么这个选项会被打钩并且会出现一个输入框供用户输入描述，如下图：再次点击这个选项则输入框消失，选项收起，我用的是Li标签，给Li标签绑定点击事件，如果被点击那么插入一个textarea标签，但是这时候被插入的textarea标签无法获得焦点，我想点击这个选项后点击输入框输入文字，但是选项被收起了，相当于触发了Li的点击事件，我的解决方法如下：即如果点击的是输入框那么return false，不让其触发li的点击事件，但是感觉不是正规解法，请问应该怎么解决这种问题，把return false换成stopPropgation阻止冒泡阻止触发li的点击事件为什么没用？

Answer 1

1.stopPropgation不行是因为你绑定在li上，其不能阻止同一个节点上的其他事件句柄被调用。而且整体运行没有被终止，后面的if仍然有效并执行。而return则直接结束了。

2.减少DOM操作，提高效率。

3.可以换种思路，代码如下：

$( '.type-2 li' ).on( {

  click( e ) {

    let $this = $( this );

    

    $this.toggleClass( 'selected' ).hasClass( 'selected' )

      ? e.target.nodeName === 'LI'

          &&  $this

                .children( 'i' )

                .remove()

      : $this

          .append(

            `<i class="iconfont icon-select-answer animated slow infinite">

                <textarea placeholder='输入具体描述(必填)：'></textarea>

             </i>`

          ).focus()

  }

});