jquery - 从模态中检索 html 并通过脚本将其转换为字符串

Question

如何通过脚本检索模式主体中的 html？因为最好将 html 转换为字符串，然后将该内容传递给 Controller ​​(并最终传递给操作方法)。

我以为我可以执行以下操作，但只是收到一条 未定义 消息。

$("#sendButton").click(function () {
            alert("Send button pressed");
            $.ajax({
                url: '@Url.Action("DidItWork", "Home", new { testEmail = "<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="59373c2e2d3c2a2d3c34383035193e34383035773a3634" rel="noreferrer noopener nofollow">[email protected]</a>"})',
                success: function (result) {
                    var body = $('#myModal').attr('modal-body');
                    alert("Success. It worked: " + body);
                }, 

关于如何最好地将 html 元素转换为字符串以便它可以与 @Url.Action 中的 testEmail 字符串一起传递的想法/建议？我还应该使用 $('#myModal').data('modal-body') 而不是 .attr 吗？

在 _layout.cshtml 文件中，代码如下:

<div class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body&hellip;</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

再往下有一个脚本，其中包含:

<script>
    $("#sendButton").click(function () {
        alert("Send button pressed");
        $.ajax({
            url: '@Url.Action("DidItWork", "Home", new { testEmail = "<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ef818a989b8a9c9b8a828e8683af88828e8683c18c8082" rel="noreferrer noopener nofollow">[email protected]</a>"})',
            success: function (result) {
                alert("Success. It worked: " + result);
            }, 
            error: function( xhr, status, errorThrown ) {
                alert("Sorry, there was a problem! Error: " + errorThrown + ". Status: " + status + ". Console: " + xhr);
                console.log("Hello");
                console.log("Error: " + errorThrown);
                console.log("Status: " + status);
                console.dir(xhr);
                console.log("Good-bye");
            },
        });
        return false;
    });
</script>

它将 testEmail 变量传递给 homecontroller.cs:

public async Task<ActionResult> DidItWork(string testEmail)
{
        var dash = "dash equals nash";

        var manager = HttpContext.GetOwinContext().GetUserManager<ApplicationUserManager>();
        var user = new ApplicationUser { UserName = "test2 username2", Email = "<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="4c38293f3829212d25207e0c2b212d2520622f2321" rel="noreferrer noopener nofollow">[email protected]</a>" };
        user.Email = testEmail;
        var result = await manager.CreateAsync(user, "passwordGoesHere1!");
        if (result.Succeeded)
        {
            await manager.SendEmailAsync(user.Id, "Confirm your account", "Please confirm your account");

            return View();
        }

        //AddErrors(result);
        return View();    
}

Answer 1

使用 jQuery .html()函数获取特定元素的 HTML String 内容。

$('#myModal .modal-body').html();

您想要获取 modal-body 类元素的内容。在您的版本中，您可以在 #myModal 元素上获取名为 modal-body 的属性值(该属性返回 undefined，因为不存在此类属性) )