Question

我目前正在尝试将点击处理程序附加到我的<a>标记，该标记会弹出我的模态，该模式具有动态ID。我无法找出完成此操作的语法 - 我目前的尝试可以在下面找到，并且在onclick="$('#"+ @modalId + "')"上有一个语法错误（这是我努力的部分）。我怎么能做到这一点？

var modalId = string.Format("docusign{0}", doc.Id)
<a href="#" onclick="$('#"+ @modalId + "').modal('toggle')">@string.Format("Document {0}", EnumHelper.GetDisplayName(doc.DocumentType))</a>

<div id="@modalId" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header" style="background-color:#337ab7;color:#ffffff">
         <button type="button" class="close" data-dismiss="modal">&times;</button>
         <h4 class="modal-title">DocuSign Notice</h4>
      </div>
      <div class="modal-body form-group">
      <h5>Please allow up to 10 minutes for us to receive your e-form after you have completed it. To continue and fill out the necessary e-form, please click the "Fill Form" button below</h5>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
      <a class="btn btn-default pull-left" href=@doc.DocuSignPowerFormLink>Fill Form</a>
      </div>
    </div>
  </div>
</div>

Answer 1

您当前的代码正在渲染这样的标记（假设doc.Id的值为123

<a href="#" onclick="$('#" +="" docusign123"" "').modal('toggle')"="">Your text</a>

在C＃变量的值之前和之后你有额外的"。和额外的+

所以基本上你的jQuery选择器是

 $('#" +="" docusign1324"" "')

这是不正确的

您只需要渲染@modalId的值，并在jQuery选择器的#部分之后使用它。

这应该有效

<a href="#" onclick="$('#@modalId').modal('toggle');">Your text</a>

如果您想要更具可读性，可以将C＃表达式包装在(和)

中

<a href="#" onclick="$('#@(modalId)').modal('toggle');">Your text</a>

Answer 2

试试这个

<a href="#" onclick="$('#@modalId').modal('toggle')">@string.Format("Document {0}", EnumHelper.GetDisplayName(doc.DocumentType))</a>

Answer 3

您在 onclick 事件中连接不正确，您可以直接使用您的变量，例如 $（＆＃39; #@ modalId＆＃39;）。modal（＆＃39 ;切换＆＃39;）这个简单的错误也是这个错误的问题，当你在razor中写任何c＃语句时必须在开始之前使用@，因为var之前没有 @ modalId

    @var modalId = string.Format("docusign{0}", doc.Id)
<a href="#" onclick="$('#"+ @modalId + "').modal('toggle')">@string.Format("Document {0}", EnumHelper.GetDisplayName(doc.DocumentType))</a>

<div id="@modalId" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header" style="background-color:#337ab7;color:#ffffff">
         <button type="button" class="close" data-dismiss="modal">&times;</button>
         <h4 class="modal-title">DocuSign Notice</h4>
      </div>
      <div class="modal-body form-group">
      <h5>Please allow up to 10 minutes for us to receive your e-form after you have completed it. To continue and fill out the necessary e-form, please click the "Fill Form" button below</h5>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default pull-right" data-dismiss="modal">Close</button>
      <a class="btn btn-default pull-left" href=@doc.DocuSignPowerFormLink>Fill Form</a>
      </div>
    </div>
  </div>
</div>

MVC Razor动态构建onclick事件以显示模态

3 个答案: