Question

此代码的作用是，让用户从学校的下拉列表中进行选择。当用户选择他们想要的学校时，相应的课程出现在学校旁边的第二个选择下拉菜单中。 JS应用与选项相同的值。这不是我想要的

我想要做的是在选择时为每个程序应用不同的值。

// no changes with the base class
abstract class FoxObject : ICloneable
{
    public int lineNumber;
    public string line, name;
    public FoxObject parent;
    public List<FoxObject> children;
    private Guid guid;

    protected FoxObject(int lineNumber, string line, string name, FoxObject parent, List<FoxObject> children)
    {
        this.lineNumber = lineNumber;
        this.line = line;
        this.name = name;
        this.parent = parent;
        this.children = children;
        guid = Guid.NewGuid();
    }

 //Code not relevant to this question.
}

// example Graphic object
class Graphic : FoxObject
{
    public new List<Symbol> children; // like this.
}

HTML

$institution = [];

$institution['s1']  = ['Criminal Justice', 'Organizational Leadership'];
$institution['s2']  = ['Organizational Leadership'];


$( "#institution" ).change(function () {


    if ( $("#program option").length) {
        $("#program option:gt(0)").remove();
    }


    $( "#institution option:selected" ).each(function() {
        $program_val = $( this ).val();
    });


    $program = $institution[$program_val];


    if ( $program ) {
        for ($i = 0; $i < $program.length; $i++) {
            $opt = '<option value="' + $program[$i] + '">' + $program[$i] + '</option>';
            $('#program').append($opt);
        }
    }
});

不是我想要的 enter image description here

Answer 1

嗯......我不知道你想要什么样的价值，但你可以轻松地使用你的索引：

if ( $program ) {
        for ($i = 0; $i < $program.length; $i++) {
            $opt = '<option value="' + $i + '">' + $program[$i] + '</option>';
            $('#program').append($opt);
        }
    }

Answer 2

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script>
$institution = [];

$institution['s1']  = ['Criminal Justice', 'Organizational Leadership'];
$institution['s2']  = ['Organizational Leadership'];

$( function(){
  
  $( "#institution" ).change(function () {

  var programHtml = '<option>--select--</option>';

    if( $( "#institution" ).val() != 0 ){
      
      $.each( $institution[$( "#institution" ).val()], function(index, ele){
         programHtml += '<option value="'+ ele +'">'+ele+'</option>';
      } );
    }
  
    $('#program').html( programHtml );
  });
} )

</script>

<label class="label">Choose an Institution:</label>
<label class="select">
<select id="institution" name="institution">
<option value="0">--select--</option>
<option value="s1">School1</option>
<option value="s2">School2</option>
</select>
<i></i></label>

<label class="label">Choose a Program:</label>
<label class="select">
    <select name="program" id="program">
    <option value="0">--select--</option>
</select>
<i></i></label>

＆＃13;

Answer 3

参考您在问题中添加的最新评论，您可以使用以下代码实现所需。您必须以可以单独指定键和值的方式定义数组。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script>
$institution = [];

$institution['s1']  = [['school1-chrim-just','Criminal Justice'], ['school1-org-lead','Organizational Leadership']];
$institution['s2']  = [['school2-org-lead','Organizational Leadership']];

$( function(){

  $( "#institution" ).change(function () {

  var programHtml = '<option>--select--</option>';

    if( $( "#institution" ).val() != 0 ){

      $.each( $institution[$( "#institution" ).val()], function(index, ele){
         programHtml += '<option value="'+ ele[0] +'">'+ele[1]+'</option>';
      } );
    }

    $('#program').html( programHtml );
  });
} )

</script>

<label class="label">Choose an Institution:</label>
<label class="select">
<select id="institution" name="institution">
<option value="0">--select--</option>
<option value="s1">School1</option>
<option value="s2">School2</option>
</select>
<i></i></label>

<label class="label">Choose a Program:</label>
<label class="select">
    <select name="program" id="program">
    <option value="0">--select--</option>
</select>
<i></i></label>

请检查 Fiddle here

使用从条件创建的选择下拉列表中的不同值

3 个答案: