0

我正在使用一个名为 impromptu 的 jquery 插件来显示一个对话框。作为对话框的一部分，有一个 div 持有按钮。div定义如下...

<div class="jqibuttons ">
<button class=" jqibutton jqidefaultbutton " value="1" name="jqi_state0_buttonNext">Next</button>
</div>

div 的样式定义如下...

div.jqi .jqibuttons {
    background-color: #f4f4f4;
    border-radius: 0 0 6px 6px;
    border-top: 1px solid #e4e4e4;
    margin: 0 -7px -7px;
    text-align: right;
}

它看起来像下面的屏幕截图。我想在我说过“在此处显示错误消息”的地方显示一条错误消息（左上角）。

在此处输入图像描述

我曾尝试在 div 中放置一条错误消息，但我遇到了问题。这是我用来尝试添加错误的功能...

function addErrorToDialog(error) {
    var message = '<span id="messageBox" style="display: block; width:100%"><span class="dialog-error red-text">' + error + '</span></span>';   
    $("#messageBox").empty();
    $('.jqibuttons').prepend(message);          
}

我已经尝试了一些不同的事情（正如您可以通过 display:block 的不寻常跨度看到的那样），但我无法让消息按我的意愿显示。有人可以帮我解决如何修改以更接近我所追求的东西吗？

下面的屏幕截图显示了我的代码当前生成的内容。不是我所追求的。

在此处输入图像描述

谢谢

- 编辑 - -

尝试使用追加而不是前置，但错误出现在右侧，因为正如您在我的原始帖子中的 css 中看到的那样 text-align 设置为正确。如何更新 css 以使按钮保持在原位，但获取错误消息以在跨度中左对齐？

在此处输入图像描述

4

1 回答 1

1

该消息显示在按钮上方，因为您正在使用 prepend in$('.jqibuttons').prepend(message);

相反，.append(message)与类一起使用消息“在此处显示错误消息”。如，说代码是

<div class='errorMsg'>Show Error Message Here</div>
$(".errorMsg").append(message);
于 2015-08-18T06:13:09.420 回答