在 razor 代码中使用 javascript/jquery

Posted 2023-04-12

【中文标题】在 razor 代码中使用 javascript/jquery

【英文标题】：Using javascript/jquery from within razor code

【发布时间】：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
 

【参考方案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>