根据选择jQuery / MySQL显示输入字段

时间:2014-03-21 18:39:35

标签: php jquery mysql

我在数据库的选择字段中生成选项,并根据用户选择显示某些输入字段。

foreach($options as $key => $value)
      {
          if ($current==$key){
              $html .= "<option selected='selected' value='$key' name='$value'>$value</option>";
          } else {
              $html .= "<option value='$key' name='$value'>$value</option>";
          }

      }

以下是使用数据库中动态变量的输入字段:

<input style='display:none;' type='text' class='_{$status_id}' value='{$question}' name='answers[$status_id][$id]' onfocus=\"this.value = this.value=='{$question}'?'':this.value;\" onblur=\"this.value = this.value==''?'{$question}':this.value;\" />

以下是根据用户选择显示特定输入字段的当前jQuery代码:

$(document).ready(function() {
    $(".rfq_select").change(function() {
        var selected = $(this).val();
        if (selected == '1'){
            $("._1").css("display", "block");
            $("._2").css("display", "none");
            $("._3").css("display", "none");
        } else if (selected == '2'){
            $("._1").css("display", "none");
            $("._2").css("display", "block");
            $("._3").css("display", "none");
        } else if (selected == '3'){
            $("._1").css("display", "none");
            $("._2").css("display", "none");
            $("._3").css("display", "block");
        } else if (selected == '4'){
            $("._1").css("display", "none");
            $("._2").css("display", "none");
            $("._3").css("display", "none");
        } 
        else {
            $("._1").css("display", "none");
            $("._2").css("display", "none");
            $("._3").css("display", "none");
        }
    });
});

我想知道如何将jQuery代码更改为更具动态性。如果我要在数据库中添加一个新选项,比如选项&#34; 4&#34;,我就不想来到页面并添加&#34; ._ 4&#34;每次向数据库添加新选项时,都会对每个选项进行处理。

将jQuery更新为:

$(document).ready(function() {
    $("#edit_table input[type=text]").hide();
    $(".rfq_select").change(function() {
        var selected = $(this).val();
        $("." + selected).show();
        $("#edit_table input[type=text]").not("." + selected).hide();
    });
});

感谢帮助人员!!

2 个答案:

答案 0 :(得分:0)

使用$("._" + selected)动态选择正确的输入。

$(".rfq_select").change(function() {
    var selected = $(this).val();
    $('input[type=text]').hide();// hide all inputs
    $("._" + selected).show();// show the selected input 
});

答案 1 :(得分:0)

$(".rfq_select").change(function() {
    var selected = $(this).val();
    $('input[class^=_]').hide();// hide all inputs
    $("._" + selected).show();// show the selected input 
});