Javascript 在输入父级之外追加一个div

我对javascript相当陌生，尽管我尝试了研究，但我还是无法理解这一点。如何跟踪div内输入的更改并触发对外部div的追加？我的代码如下：

用“挂起”一次追加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)));
    }
});

功能更改状态（statusValue）{
$（“输入”，“选择形式”）.val（状态值）.触发器（“更改”）；
}
$（“输入”，“选择形式”）.change（函数（）{
if（！$（this.val（））{
$（“待定”）。附录（$（“h3”）。上一页（$（本））；
}
});

---

但这似乎不起作用。有什么想法吗？

把一个空的div放在你想要新div的地方，给它一个id，即（

），然后像这样附加你想要的内容

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

$（“#myDiv”）。追加（“待定”）；

你也可以查一下

更多的解释

谢谢。

试试这个：

$("input",".select-form").on("change", function(){
     var $this = $(this);
     if (!$this.val()){
            var elem = $('<h3>Best Overall Costume<div class="pending">Pending</div></h3>');                
            $this.parent().parent().before(elem);
     }
});

$（“输入”，“选择表格”）。在（“更改”，函数（）上）{
var$this=$（this）；
如果（！$this.val（））{
var elem=$（“最佳总体目标”）；
$this.parent（）.parent（）.before（elem）；
}
});

您还可以检查是否已经添加了挂起的div，而不是再次添加它

---

当然，这个解决方案假设在目标div（您要在其之前追加）和输入控件之间没有其他嵌套div

我在这里做了几件事。。。首先，我不知道为什么要把它全部放在一个命名函数中。当您使用事件监听器时，这通常是不必要的

然后，我不知道val支票是用来做什么的，所以我把它倒过来了

最后，我使用的是

one（）

，它只运行一次。这个案子似乎需要这样做

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

$（'.select form'）。一个（'change'，'input'，function（）{
if（$（this.val（））{alert（'asdgf'）；
$（“待定”）
.appendTo（$（this.parent（）.prev（'h3'））；
}
});