Question

我有这个追加脚本，它在我的表单上添加了一组字段。根据附加字段，如果“status”的值为“Actual”，我希望“upg”选择字段仅显示。这个条件应该适用于所有附加的字段集，这样如果status1是Actual，我有一个upg字段但是status2是Ghost，upg2字段应该被隐藏，依此类推。你们有什么建议最好的方法呢？

    <script type="text/javascript">
    var count = 0;
    $(function(){
    $('a#add_field').click(function(){
    count += 1;

    $('#activation').append(
        '<div class="row-fluid">'                   
        +'<div class="span12" style="border-bottom:1px #dddddd; background-color:#e8e8e8; ">'

                +'<div style="float:left; width:7%;">'
                +'<label>&nbsp;</label>'                    
                +'<select name="status' + count + '" id="status' + count + '"  class="input-small">'
                +'<option value="Ghost">Ghost</option>'
                +'<option value="Actual">Actual</option>'
                +'</select>'
                +'</div>'

                +'<div style="float:left; width: 7%">'
                +'<label>Type</label>'
                +'<select id="upg' + count + '" name="upg' + count + '"  class="input-small" >'
                +'<option value="" selected="&nbsp;" >&nbsp;</option>'
                +'<option value="Exp" >Exp</option>'
                +'<option value="Post" >Post</option>'
                +'<option value="Upgrade" >Upg</option>'
                +'<option value="Retail" >Retail</option>'
                +'</select>'
                +'</div>'
         );     
      });   
});

Answer 1

if（$（'＃status'）。value ==“Actual”）{//追加

Answer 2

我个人觉得更容易分解一组复杂的html - 特别是使用某种逻辑来确定最终dom - 进入多个jquery对象。虽然将多个对象附加在一起比较慢，但与内联方式相反，有时候值得清晰。

无论如何，您需要一些数据或设置来确定初始选择的状态选项，您可以使用相同的值来显示/隐藏相应的upg。我建议你将它分成两个附加，在将它附加到dom之前隐藏它，这样你就不会看到upg选择flash：

var some_setting_or_db_val = 'ghost';

var row = $('<div class="row-fluid">'                   
    +'<div class="span12" style="border-bottom:1px #dddddd; background-color:#e8e8e8; ">'

            +'<div style="float:left; width:7%;">'
            +'<label>&nbsp;</label>'                    
            +'<select name="status' + count + '" id="status' + count + '"  class="input-small">'
            +'<option value="Ghost">Ghost</option>'
            +'<option value="Actual">Actual</option>'
            +'</select>'
            +'</div>'

            +'<div style="float:left; width: 7%">'
            +'<label>Type</label>'
            +'<select id="upg' + count + '" name="upg' + count + '"  class="input-small" >'
            +'<option value="" selected="&nbsp;" >&nbsp;</option>'
            +'<option value="Exp" >Exp</option>'
            +'<option value="Post" >Post</option>'
            +'<option value="Upgrade" >Upg</option>'
            +'<option value="Retail" >Retail</option>'
            +'</select>'
            +'</div>');

if(some_setting_or_db_val == 'ghost'){
    row.find("#upg" + count).hide();
}

$('#activation').append(row)

如果不满足条件，则隐藏附加的表单字段

2 个答案: