javascript - jquery将元素添加到第一个孩子？

Question

我有一个带有两个按钮的简单部分，这些元素是动态创建的，我想使用 jquery 将输入附加到第一个按钮。

这是我的解决方案

HTML

<div id="interactive-layers">
    <div class="go_back">Go back</div>
    <div buttonid="3" class="video-btns show" targetmovieid="4" starttime="2.44" endtime="8.36">
        <span class="label">Submit</span></div>
    <div buttonid="81" class="video-btns show" targetmovieid="undefined" starttime="2.44" endtime="8.36">
        <span class="label">undefined</span></div>
</div>

JS

 var getButons = $('.video-btns').attr('buttonid');
    var targetmovieid = $(videobtns).attr('targetmovieid');
    if(getButons == 81 && targetmovieid =='undefined'){
        var inputf = $("<input id='username' style='background: red' class='sync-element' starttime='3' endtime='6'></input>");
            inputf.appendTo('.video-btns');  
    }else{
        console.log('something is fucking wrong');
    }

现在，当我运行我的应用程序时，我得到以下结果

<div id="interactive-layers">
    <div class="go_back">Go back</div>
    <div buttonid="81" class="video-btns show" targetmovieid="4" starttime="2.44" endtime="8.36">
         <span class="label">Submit</span>
        <input id="username" style="background: red" class="sync-element" starttime="3" endtime="6">
    </div>
    <div buttonid="3" class="video-btns show" targetmovieid="undefined" starttime="2.44" endtime="8.36">
      <span class="label">undefined</span>
        <input id="username" style="background: red" class="sync-element" starttime="3" endtime="6">
    </div>
</div>

我的代码添加到两个按钮我只想添加到按钮buttonid=81 我做错了什么？

标签： javascriptjqueryhtml

Answer 1

$('.video-btns').each(function() {
    var getButons = $(this).attr('buttonid');
    var targetmovieid = $(this).attr('targetmovieid');
    if (getButons == 81 && targetmovieid == 'undefined') {
        var inputf = $("<input id='username' style='background: red' class='sync-element' starttime='3' endtime='6'></input>");
        inputf.appendTo(this);
    } else {
        console.log('something is fucking wrong');
    }
});