Javascript 单击对话框按钮在jquery对话框中显示html格式的文本

当发现字段验证错误时，我会打开一个对话框。我已经成功地在jQuery对话框中捕获了html格式的文本。我在对话框中定义了3个按钮。继续关闭对话框，显示应显示fielderrors html文本的字段，并显示应显示错误详细信息的详细信息

下面是页面中的HTML代码

<div id="dialogpresubval" title="Pre-Submit Validation Errors" style="display:none">
    <div id="fielderrors" style="display:none"> &nbsp; </div>
    <div id="errordetail" style="display:none"> &nbsp; </div>
</div>

这是Ready函数中.js文件中的代码 当我按下主窗体上的Submit按钮时，我返回了PresbFields和PresbDetail变量。我知道该部分正在工作，因为console.log行显示了正确的信息。 出于测试目的，您可以使用

var presubfields = "The following fields contain errors: <br> member status <br> member since";

$(function() {
    $( "#dialogpresubval").dialog({
        autoOpen: false, 
        hide: "puff",
        modal: true,
        closeOnEscape: false,
        height:400,
        width:450,
        resizable: true,
        draggable: true,
        title: "Pre-Submit Validation Errors",
        open: function() {
            console.log("4119 - On Open presubfields is: " + presubfields);  // I see the presubfields variable and its text;
            // $("#fielderrors div").html(presubfields);
            // $("#fielderrors", {html:presubfields});
           },          
           buttons: [ 
            {
               text: "Continue",
               click: function() {
                   var button = $(this).prop("id"); 
                   console.log("4127 You clicked on:", button);
                   $(this).dialog("close");
               },
            },
            {
                text: "Show Fields",
                click: function() {
                   var button = $(this).prop("id"); 
                   // Show the Fields requiring correction - div id = fielderrors
                    //var field_errors = $('#dialogpresubval').attr('note_text');
                console.log("4143 - presubfields = " + presubfields);  // console shows the correct information;
                //$("#fielderrors").append(presubfields);
                //$("#fielderrors", {html:presubfields});
                $("#fielderrors").text("presubfields should be shown");
                // Used this to test for generic text - $("#fielderrors").text("presubfields should be shown");
                // $("#fielderrors").val(presubfields);
                //$("#fielderrors").prop('display', 'block');
                $("#fielderrors").css({'display':'block'});
                $("#errordetail").hide();
                },

            },
            {
                text: "Show Details",
                click: function() {
                // Show the Details of the errors - div  id = errordetail
                // presubfields presubdetail
                $("#errordetail").val(presubdetail);
                $("#errordetail").show();
                $("#fielderrors").hide();
                },
            }
           ],
           position: {
              my: "center center",
              at: "center center"
           }

        });
    });

我在注释掉的字段中留下了内容，以便您可以看到我已经尝试过的内容。我无法使presubfields或presubdetail显示在相应的div中

我想要的是，当按下ShowFields按钮时，会显示presubfields html，presubdetail也是如此

谢谢你的关注

您接近$fielderrors div.htmlpresbfields；但也就是说，找到一个div元素，该元素位于另一个id为fielderrors的元素中。HTML中没有这样的元素

相反，您可以只使用元素上的id，id应该是唯一的，因此它将是$fielderrors.htmlpresbfields；在open函数中

现在html位于适当的div中，因此下一步是在单击相应的按钮时显示和/或隐藏元素。下面是一个例子

var presubfields=以下字段包含错误：成员状态成员自； var presubdetail=我是一个错误详细信息的示例。； $function{ $dialogpresubval.dialog{ 自动打开：错误， 隐藏：喘息， 莫代尔：是的， closeOnEscape：错误， 可调整大小：正确， 真的， 标题：提交前验证错误， 开放：功能{ $fielderrors.htmlpresbfields $errordetail.htmlpresbdetail； }, 按钮：[{ 案文：继续， 单击：函数{ var按钮=$this.propid； console.log4127您单击的：，按钮； $this.dialogclose； }, }, { 文本：显示字段， 单击：函数{ $fielderrors.show； $errordetail.show； }, }, { 文本：显示详细信息， 单击：函数{ $fielderrors.hide； $errordetail.show； }, } ], 职位：{ 我的：中心， 在：中心 } }; //显示模态 $dialogpresubval.对话框打开； };

---

安德鲁，谢谢你！！！我已经在Chrome和IE中运行了你的代码片段，它完全按照我需要的方式工作。我更新了我的脚本并尝试了它，但我仍然有一个问题，所以需要回去看看我所做的是什么阻止了工作。@CharlesBrengel不客气！如果这回答了你原来的问题，请随意接受。如果你还有其他问题，你可以再发一个。安德鲁，我想我接受了你的回答。如果我没有，就回答吧。再次感谢。我创建了一个更像我的代码的小提琴东西。只是基本的东西。我第一次创作小提琴。我无法让它工作。如果您能修改，我将不胜感激。这里是@CharlesBrengel，试着问另一个关于堆栈溢出的问题，并提供关于新问题的更多细节。你也可以给我发个短信，我会看的。到目前为止，我不确定你的新问题是什么。