【问题标题】:Using javascript/jquery from within razor code在 razor 代码中使用 javascript/jquery
【发布时间】:2017-07-31 05:35:13
【问题描述】:

看起来很简单,但我不知道如何从 razor 代码中调用 javascript 函数。

问题:我需要通过 id 获取表头中列的位置。我正在从我的剃须刀代码中调用 getPosition 函数

<table>
   <thead>
       <tr>
       @foreach (Assessment geAssessment in Model.assessments)
       {
          <th id=@geAssessment.AssessmentID>@geAssessment.Name</th>
       }
       </tr>
   </thead>
   <tbody>
     <tr>
       @foreach (ShortResult geResult in Model.results)
       {
           @:{ var i = getPosition(@geResult.assessmentId);}
       }
      </tr>
  </tbody>
 </table>   
  • 我的脚本在同一视图/页面中

    <script type="text/javascript">
       function getPosition(id) {
        var c = '#' + id;
        alert(c);
        return $c.index();    
      }
    
      $(function () {});
    </script>
    

更新

按照 Max 的建议,我将表格更改如下,这很完美,但现在我如何在 td 中设置值

<tbody>
  <tr>
    @{
                                    var index = 4; //start index of assessments will be 4
                                    foreach(Assessment geAssessment in Model.assessments)
                                    {
                                    <td>
                                        @foreach (ShortResult geResult in Model.results)
                                        {
                                            if(geResult.StudentID == geStudent.studentid)
                                            {
                                            @:
                                                <script>
                                                    {

                                                        var assessmentIndex = getPosition(@geResult.assessmentId);
                                                        @*if (assessmentIndex == @index) {
                                                            geResult.ResultValue
                                                        }*@

                                                    }
                                                </script>

                                            }
                                        }
                                     </td>
                                    index++;
                                    }
                                 }
  </tr>    
 </tbody>

现在让我解释一下发生了什么..

  • 我想根据模型中的评估数量连续添加 x 个 tds
  • 对于每个 td,我检查我是否有带有此特定评估 ID 的结果,如果是,我想在 td 中打印它。这里有一些语法错误:

    if (assessmentIndex == @index) {
                                                                geResult.ResultValue
     }
    

【问题讨论】:

    标签: javascript c# jquery asp.net-mvc razor


    【解决方案1】:

    您的带有 getPosition 函数的脚本必须在您的调用之上。在@: 之后你必须使用指令,否则它被认为是一个文本。您的代码必须如下所示:

    <script type="text/javascript">
      function getPosition(id) {
        var c = '#' + id;
        alert(c);
        return $c.index();    
      }
    
      $(function () {});
    </script>
    
    
    <table>
       <thead>
           <tr>
           @foreach (Assessment geAssessment in Model.assessments)
           {
              <th id=@geAssessment.AssessmentID>@geAssessment.Name</th>
           }
           </tr>
       </thead>
       <tbody>
         <tr>
           @foreach (ShortResult geResult in Model.results)
           {
               @: <script>{ var i = getPosition(@geResult.assessmentId);}</script>
           }
          </tr>
      </tbody>
     </table>
    

    【讨论】:

    • 是的,这个位有效!但它说我不能在 标记中使用
    【解决方案2】:

    您好,不需要@: 语法,您可以直接使用它,所以现在您的代码如下所示。

     <script type="text/javascript">
      function getPosition(id) {
        var c = '#' + id;
        alert(c);
        return $c.index();    
      }
    
      $(function () {});
    </script>
    
    <table>
       <thead>
           <tr>
           @foreach (Assessment geAssessment in Model.assessments)
           {
              <th id=@geAssessment.AssessmentID>@geAssessment.Name</th>
           }
           </tr>
       </thead>
       <tbody>
         <tr>
           @foreach (ShortResult geResult in Model.results)
           {
            <script>{ var i = getPosition(@geResult.assessmentId);}</script>
           }
          </tr>
      </tbody>
     </table>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-06-20
      • 1970-01-01
      • 1970-01-01
      • 2011-09-18
      • 1970-01-01
      相关资源
      最近更新 更多