显示/隐藏每个动态子元素？

Question

我有一个表单，我想在我选择表单时显示子元素。

到目前为止我已经完成了但是我无法实现我想做的事情

让我告诉你代码

点击表单底部的ADD按钮后，当您看到已在上面上传的图像时，另一个表单已在现有表单右侧打开

my demo link

和隐藏.ekle类的div我希望出现.ekle div

和我的js功能

$(document).ready(function(){


 /** select seçim*/
    $('.havale_tipi').on('change', function (e) {
        var top_div = $(this).parents(".ekle").find(this);
        var optionSelected = $("option:selected", this);
        var indexSelected = this.index;
        var valueSelected = this.value;

        if(indexSelected=="iban_no"){
            $(".hesaba_form").fadeOut();
            $(".iban_no_form").fadeIn();
        }else if(indexSelected="hesaba_form"){
            $(".iban_no_form").fadeOut();
            $(".hesaba_form").fadeIn();
        }

    });

 /**select seçim bitiş*/

 /** form ekle **/
 $(".btn_ekle").on("click",function(e){
    var nesne = $(".ekle");
    var ekle = nesne.html();
    $(".add_after").append(ekle).show();
    e.preventDefault();
 })
 /** form ekle bitiş**/
});

Answer 1

1. 您应该使用.val()来获取所选值
2. 您在=州
中忘记了一个else if
3. else if中的值应为hesaba而不是hesaba_form，或删除else if语句并仅使用else
4. 为了让您的愿望有效，您应该在elke div中创建一个包含表单的父元素。这有助于注册听众。
5. 您应该使用on注册一个事件监听器，甚至可以监听将来出现的元素。

HTML：

<div class="elke">
    <div class="group">
        <!-- your form here again -->
    </div>
</div>

JS：

$(function() {
    $(".btn_ekle").on("click", function(e) {
        var ekle = $(".ekle").html();
        $(".add_after").append(ekle).show();
        e.preventDefault();
    });

    $(document).on('change', '.havale_tipi', function() {
        var value = $(this).val(),
            parent = $(this).closest(".group");

        if (value == "iban_no") {
            $(".hesaba_form", parent).fadeOut();
            $(".iban_no_form", parent).fadeIn();
        } else {
            $(".iban_no_form", parent).fadeOut();
            $(".hesaba_form", parent).fadeIn();
        }
    });
});