Question

我想做以下事情：

有一个选择框，

<select name="some" id="some">
    <option value="xx">xx</option>
    <option value="yy">yy</option>
    <option value="ww">ww</option>
    <option value="zz">zz</option>
    <option value="uu">uu</option>
</select>

当我选择选项xx时，打开另一个选择框

<select name="some_xx" id="some_xx">
    <option value="xx">xx</option>
    <option value="yy">yy</option>
    <option value="ww">ww</option>
</select>

然后，如果我在some_xx中选择YY或WW或XX选项，则会加载一些html信息（表单）。如果我选择了其他选项（不是xx），它还会加载一些html信息（表格）。

所有表单都不同，所以我想加载一个包含所有表单的外部文件，是否可能？如何做到这一切？

我知道它会涉及一些javascript，但我真的不知道怎么样，我已经搜索了很多，看到了一些像load()这样的函数，并创建了选择，但无法弄明白。

提前致谢

编辑：我有这个代码，但它不是动态的，它不能正常工作......

<script>
$(function(){ 
       function changeForm($(this)) {
            $('#form').load('$(this).html');
       }  

       function changeForm_xx($(this)) {
            $('#form2').load('$(this).html');
       } 

      $('#some').change(function() {
           changeForm($(this));
      });    
      $('#some_xx').change(function() {
           changeForm_xx($(this));
      });
});
</script>

而且，我想在更改select

时删除加载内容

更新：工作：关闭

Answer 1

将其改为这样。你的脚本中有很多错误。见演示：JsFiddle Demo

错误列表

function changeForm($(this)) //这里你添加了额外的括号和Jquery obj。

$ ('#form2').load('$(this).html') //这是错误的。你需要打电话如下。它是yourObj.html()方法。

 function changeForm(obj) {
   var someVar= $(obj).html();
        $('#form').load(someVar); //here you perform load Operation. 

   }  

   function changeForm_xx(obj) {
      var someVar= $(obj).html();
        $('#form').load(someVar); //here you perform load Operation. 
   }

  $('#some').change(function() {
       changeForm($(this));
  });    
  $('#some_xx').change(function() {
       changeForm_xx($(this));
  });

在select和other中选择框

1 个答案: