JQueryUI Dialog插入文本的方式

Posted 2023-05-08

【中文标题】JQueryUI Dialog插入文本的方式

【英文标题】：JQueryUI Dialog ways of insert text

【发布时间】：2019-03-30 10:03:39

【问题描述】：

我正在使用 JQueryUI 对话框来显示模式确认，它工作正常，问题是我想向用户显示的文本。我不想为此目的使用标题属性，所以我需要将文本放在 html 标记 div （对话框）中。这种方法的唯一问题是，放在 div 或 p 或 span 等中的文本会在对话框打开之前显示，因此我需要额外努力通过 css 隐藏文本，并在对话框打开时显示。 这是使用对话框 jqueryui 的唯一方法吗？

【问题讨论】：

你能发布你的代码吗？

请分享minimal reproducible example

【参考方案1】：

您不必隐藏内容。我认为您没有使用 jquery 对话框的 autoOpen 属性。如果你使用autoOpen:true，jquery ui 对话框会隐藏内容。

<div id="dialog_content">
  <p>Here goes your dialog content</p>
  <input type="text" placeholder='sample text'>
</div>

<button id="click_me">
Click Me
</button>

和脚本

$(document).ready(function()
    $('#dialog_content').dialog(
        autoOpen:false
  );
  $('#click_me').click(function()
    $('#dialog_content').dialog('open');
  );
);

查看demo

如果这不是你的意思，那么请用代码发布问题

【参考方案2】：

<div id="dialog">
<p>
 This is a text dialog
</p>
</div>

$('#dialog').dialog(
autoOpen: false                        
);

即使将 autoOpen 设置为 false，它也会在

中显示文本“这是一个文本对话框”

。我必须用 CSS 隐藏，但我认为这是我应该通过使用 JQueryUI 对话框来避免的问题。