javascript - 在输入父级之外附加一个 div

Question

我是 javascript 的新手，尽管我尝试进行研究，但我还是无法弄清楚这一点。如何跟踪 div 中输入的变化并触发附加到外部 div？我的代码如下:

一旦“.image-value”输入的值发生变化，就用“Pending”附加 h3

<!-- APPEND <h3> -->
<h3>Best Overall Costume<div class="pending">Pending</div></h3>
<div>
  <div class="select-form">
    <img src="images/vote.jpg" data-value="image_value">
    <img src="images/vote.jpg" data-value="image_value2">
    <img src="images/vote.jpg" data-value="image_value3">
    <img src="images/vote.jpg" data-value="image_value4">
    <img src="images/vote.jpg" data-value="image_value5">
    <!-- Track the change of this input -->
    <input type="hidden" class="image-value" name="selected_image" value="">
  </div>
</div>

我试过这个:

function changeStatus(statusValue) {
    $("input",".select-form").val(statusValue).trigger("change");
}

$("input",".select-form").change(function(){
    if (!$(this).val()){
        $("<div class='pending'>Pending</div>").appendTo($("h3").prev($(this)));
    }
});

但这似乎没有用。有什么想法吗？

Answer 1

在您想要新的 div 的地方放置一个空的 div，并给它一个 ID，即(<div id='myDiv'><div>)，然后像这样附加您想要的内容。

$( "#myDiv" ).append( "<div class='pending'>Pending</div>" );

您还可以检查Append Explained

更多的解释。

谢谢。