通过.innerhtml（）在子DIV中添加HTML表单时，使用JQuery切换DIV

首先，如果这是一个补救问题，我很抱歉。一般来说，我对JQuery和Javascript非常陌生

因此，在我的HTML文件中，我有两个div，我想根据表单中的单选按钮选择来切换它们

<div id = 'mySched'></div>
<div id = 'orView'></div>

因此，当所有内容都在HTML文件中时，它工作得很好……选择“userSched”显示mySched DIV，选择“orActivity”，隐藏mySched DIV并显示orView DIV。这太棒了

我的问题是，我必须使HTML更加动态，因此利用外部JS文件通过.innerhtml（）插入HTML

因此，我希望使用完全相同的DIV名称和表单名称，但现在表单是在外部JS文件中定义的，而不是在HTML文件中定义的。现在，我将使用以下DIV引用表单HTML代码：

<div id ='viewSelector'></div>

我如何修改上面的JQuery脚本，以便像以前一样正确地切换这两个选项，引用现在嵌套在“viewSelector”DIV中的表单？？我相信这对你的JQuery高手来说很容易……我只是对此一无所知

---

提前感谢。

为事件处理程序分配

.on（）

而不是

。如果元素是动态创建的（如果初始页面加载时没有单选按钮），请单击（）

实际上，实际上，总是使用
.on（）
来代替，这样会更好

另外，使用
.val（）
代替
.attr（“值”）

$（文档）.ready（函数（）{
$（“#或视图”）.hide（）；
$（“#mySched”）.show（）；//<这里有一个bug，请查看您的代码
$（文档）。在（'click'，'input[type=“radio”]”上，函数（）{
if（$（this.val（）=“userSched”）{
$（“#或视图”）.hide（）；
$（“#mySched”）.show（）；
}
if（$（this.val（）=“orActivity”）{
$（“#mySched”）.hide（）；
$（“#或视图”）.show（）；
}});
});
您可以删除JQuery ready函数

<script type="text/javascript">
    $("#orView").hide();
      $("#mySched").show();   // < there was a bug here , see your code


      $(document).on('click', 'input[type="radio"]', function(){
       if($(this).val() =="userSched"){
           $("#orView").hide();
           $("#mySched").show();
       }

       if($(this).val() =="orActivity"){
           $("#mySched").hide();
           $("#orView").show();
       }});
</script>


$（“#或视图”）.hide（）；
$（“#mySched”）.show（）；/<这里有一个bug，请查看您的代码
$（文档）。在（'click'，'input[type=“radio”]”上，函数（）{
if（$（this.val（）=“userSched”）{
$（“#或视图”）.hide（）；
$（“#mySched”）.show（）；
}
if（$（this.val（）=“orActivity”）{
$（“#mySched”）.hide（）；
$（“#或视图”）.show（）；
}});

尝试一下
将选择器
输入[type=“radio”]
更改为
#查看选择器输入[type=“radio”]
？非常感谢，这非常有帮助，效果非常好。
<div id ='viewSelector'></div>

$(document).ready(function(){
  $("#orView").hide();
  $("#mySched").show();   // < there was a bug here , see your code


  $(document).on('click', 'input[type="radio"]', function(){
   if($(this).val() =="userSched"){
       $("#orView").hide();
       $("#mySched").show();
   }

   if($(this).val() =="orActivity"){
       $("#mySched").hide();
       $("#orView").show();
   }});
  });

<script type="text/javascript">
    $("#orView").hide();
      $("#mySched").show();   // < there was a bug here , see your code


      $(document).on('click', 'input[type="radio"]', function(){
       if($(this).val() =="userSched"){
           $("#orView").hide();
           $("#mySched").show();
       }

       if($(this).val() =="orActivity"){
           $("#mySched").hide();
           $("#orView").show();
       }});
</script>