即使插入后也找不到分离的元素

我有一个 id= 的元素search。我尝试从 a 中分离元素<td>并将其插入另一个<td>,但它只是第一次发生,然后给出undefined.


$('body').on('click', '.select-area', function () {

    var element = $('#search').detach();


    $('tr[id_area="' + parseInt($(this).attr('area-id')) + '"]')

        .find('td:eq(1)')

        .html('<div id="search">' + element.html() + '</div>');

});

我怎样才能让后续点击也发生这种情况.select-area?非常感谢您的帮助


慕少森
浏览 78回答 2
2回答

繁华开满天机

只需选择它并将其附加到新位置。元素将被移动,事件将保留。$('body').on('click', 'td.select-area', function () {&nbsp; &nbsp; var element = $('#search');&nbsp; &nbsp; $(this)&nbsp; &nbsp; &nbsp; &nbsp; .closest("tr")&nbsp; &nbsp; &nbsp; &nbsp; .find('td:eq(1)')&nbsp; &nbsp; &nbsp; &nbsp; .append(element);});$("#test").on("input", function (e) {&nbsp; console.log(e.originalEvent.data);})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><table>&nbsp; <tr>&nbsp; &nbsp; <td class="select-area">1</td>&nbsp; &nbsp; <td><span id="search"><input id="test" /></span></td>&nbsp; </tr>&nbsp; <tr><td class="select-area">2</td><td></td></tr>&nbsp; <tr><td class="select-area">3</td><td></td></tr>&nbsp; <tr><td class="select-area">4</td><td></td></tr>&nbsp; <tr><td class="select-area">5</td><td></td></tr></table>

三国纷争

为了分享,我的问题的一个解决方案是将分离操作移到点击事件监听器之外。这似乎是合乎逻辑的,因为在我的情况下,此操作只需要执行一次。// On document readyvar element = $('#search').detach();$('body').on('click', '.select-area', function () {&nbsp; &nbsp; $('tr[id_area="' + parseInt($(this).attr('area-id')) + '"]')&nbsp; &nbsp; &nbsp; &nbsp; .find('td:eq(1)')&nbsp; &nbsp; &nbsp; &nbsp; .html('<div id="search">' + element.html() + '</div>');});但是 epascarello 提到的方法更简单,应该从头开始。它只是不适合我的具体情况。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript