如何将javascript应用于在手风琴内调用的部分视图？

问题描述：

我有一个CSHTML它看起来像这样：如何将javascript应用于在手风琴内调用的部分视图？

<script> 
    $(function() { 
     $("#accordion").accordion(); 

    }); 

</script> 
<div id="accordion"> 
    <h3 id="report1">Report1</h3> 
    <div> 

     @Html.Partial("~/Views/Settings/SControl.cshtml") 


    </div> 
    <h3 id="report2">Report2</h3> 
    <div> 

     @Html.Partial("~/Views/Settings/SControl.cshtml") 

    </div> 
</div>

我SControl.cshtml看起来象下面这样：我已经包含外部JavaScript文件中这个CSHTML

<script src="~/Scripts/App/pages/SControl.js" type="text/javascript"></script> 

<table> 
    <tr> 
     <th></th> 
     <th></th> 
    </tr> 
    <tr> 
     <td style="left:0.01em;"> 
      <span style="font-weight:bold;font-size:x-small;">Run Mode</span><div> 
       <select id="Mode" onchange="SubmitMode(this)"> 
        <option selected="selected" value="1">Run Continuosly</option> 
        <option value="2">Run on Schedule</option> 
       </select> 
       <br /> 

      </div> 
     </td> 
     <td> 
      <span style="font-weight:bold;font-size:x-small;">Reccurence:</span><div> 
       <select id="Recurrance" onchange="ChangeRecurrance(this)"> 
        <option selected="selected" value="1">On Time Job</option> 
        <option value="2">Reccurring Job</option> 
       </select> 
       <br /> 

      </div> 
     </td> 
</table>

类似的标签继续cshtml页面。但这些脚本仅适用于手风琴的第一个标题。尽管在所有的手风琴头文件中调用了相同的局部视图，并且在所有这些局部视图中调用了相同的JavaScript文件，但只有第一个头文件获取脚本。如何解决这个问题。请帮我

外部JS文件如下：

$(function() { 

    document.getElementById("Recurrance").disabled = true; 
    document.getElementById("starttime").disabled = true; 
    document.getElementById("endtime").disabled = true; 
    document.getElementById("divnoenddate").disabled = true; 
    $('#noenddate').prop('disabled', true); 
    document.getElementById("RecurEvery").disabled = true; 

    $(".date-picker").datetimepicker({ 
     changeMonth: true, 
     changeYear: true, 
     yearRange: "-100:+0", 
     dateFormat: 'dd-M-yy', 
     controlType: 'select', 
     timeFormat: 'hh:mm tt', 
     showTime: false, 
     showMinute: false, 
     showMillisec: false, 
     showMicrosec: false, 
     showTimezone: false 
    }); 
}); 
function ChangeCheckBox() { 
    if (document.getElementById("Mode").value != 1) { 
     debugger; 
     if (document.getElementById('noenddate').checked == true) { 
      document.getElementById("endtime").disabled = true; 
     } 
     else { 
      document.getElementById("endtime").disabled = false; 
      document.getElementById("endtime").value = ""; 
     } 
    } 
}

除非你故意试图包含相同的JavaScript文件多次，您应该只有脚本标记对于父视图中的SControl.js，而不是部分。 –

你创建了2个相同的部分（'SControl.cshtml'），这是没有意义的，这意味着你有重复的'ID'属性（无效的HTML），这反过来意味着你的脚本不会工作 –

@StephenMuecke我需要调用相同的手风琴局部视图。如果不是这样，我该怎么办？ –

答

我觉得script适用于网页加载Partial view之前。加载后需要应用script。您可以在JavaScript中使用readyState用于完成后应用所有的HTML标签和脚本是这样的：

document.onreadystatechange = function() { 
    if (document.readyState === 'complete') { 
     // your code 
    } 
}

编辑

我创建类似项目新项目并添加cshtmls and js。您的外部js适用于SControl.cshtml。例如，Recurrance div添加disabled属性（请参见下图）。

我认为外部JS代码不正确，有错误像下面的图像：

我试过但仍然不能正常工作。只适用于第一个手风琴头。其余的它不起作用。 –

@ Anon_y_20_raj所以，我需要看'外部js代码'来帮助你。 –

我修改并添加了外部js文件。 –

如何将javascript应用于在手风琴内调用的部分视图？

相关推荐