1

我基本上在做两个下拉菜单，一个决定接下来应该显示哪个选择。然后它会显示第二个下拉菜单，然后应该会显示一个新表单。我已经简化了代码，但想法应该还是一样的。我的问题是第二个没有显示它应该显示的代码。

HTML

<select id="change1" on change="changeForm(this.value);">
 <option> Select Option </option>
  <option value="c"> Option 1</option>
  <option value="p"> Option 2</option>
 </select>
  <div id="form"></div>  <div id="changep"></div>

Javascript

function changeForm(x)
{
      if(x=='c')
      {
         $('#form').html('It Works');
       }

      if(x=='p')
       {
         var code = ' <select id="option2" onselect="placeHtml(this.value);"><option>Select Message</option><option value="1m">Message 1</option><option value="2m">Message 2</option></select>';
         $('#form').html(code);
        }
}

function placeHtml(x)
 {
    if(x=='1m')
     {
         $('#changep').html('This will work');
     }

     if(x=='2m')
     {
         $('#changep').html('This is a different message');
     }
 }

现在我的问题是，当使用第一个下拉菜单时，结果符合预期，但使用第二个下拉菜单......没有任何变化。如果我使用 onchange 而不是 onselect 在我更改选择后它只有一个空白下拉菜单。我不知道这里有什么问题。有人可以帮助我吗？使用 jquery 1.8.2

4

3 回答 3

0

更改这一点，因为 onselect 属性可用于：

 ///The onselect attribute can be used with: 
 <input type="file">, <input type="password">, <input type="text">, <keygen>, and <textarea>.

  function changeForm(x)
  {
      if(x=='c')
      {
         $('#form').html('It Works');
       }
     else if(x=='p')
       {
         var code = ' <select id="option2" onchange="placeHtml(this.value);"><option>Select Message</option><option value="1m">Message 1</option><option value="2m">Message 2</option></select>';
         $('#form').html(code);
        }
  }

function placeHtml(x)
 {
    if(x=='1m')
     {
         $('#changep').html('This will work');
     }

     if(x=='2m')
     {
         $('#changep').html('This is a different message');
     }
 }</script>
于 2012-10-24T04:44:39.677 回答
0

在 Change1 和 option2 中将 onselect 更改为 onchange，它将起作用

<select id="change1" onchange="changeForm(this.value);">

和

if(x=='p')
{
     var code = ' <select id="option2" onchange="placeHtml(this.value);"><option>Select Message</option><option value="1m">Message 1</option><option value="2m">Message 2</option></select>';
     $('#form').html(code);
}

检查此演示

于 2012-10-24T03:53:59.207 回答
0

尝试在您的 option2 选择元素中将 onselect 更改为 onchange。

于 2012-10-24T03:49:39.810 回答