Javascript jQuery UI - 调用高亮/错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7998772/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery UI - calling Highlight/Error
提问by jribeiro
I'm sorry if this is too obvious but I can't find any proper answer anywhere...
如果这太明显，我很抱歉，但我在任何地方都找不到任何正确的答案......
Is there any way to place an highlight/error message like the ones on the bottom right of this page: http://jqueryui.com/themeroller/by simply calling a jquery ui function?
有什么方法可以通过简单地调用 jquery ui 函数来放置像本页右下角那样的突出显示/错误消息：http: //jqueryui.com/themeroller/？
I inspected the source code but can't seem to find the answer... Do they hardcode the html?
我检查了源代码，但似乎找不到答案......他们是否对 html 进行了硬编码？
Thanks
谢谢
----------------------------------------- SOLUTION---------------------------------------
-----------------------------------------解决方案-------- -------------------------------
jQuery: (create a new file whatever.js and place the following code there
jQuery :(创建一个新文件whatever.js并将以下代码放在那里
$(document).ready(function(){
if($("div.error")[0]){
createError($("div.error"));
}
if($("div.notice")[0]){
createHighlight($("div.notice"));
}
});
//functions start
function createHighlight(obj){
obj.addClass('ui-state-highlight ui-corner-all');
obj.html('<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right:.3em;"></span>'+obj.html()+'</p>');
}
function createError(obj){
obj.addClass('ui-state-error ui-corner-all');
obj.html('<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right:.3em;"></span>'+obj.html()+'</p>');
}
HTML: Simply create de divs that you want to place the messages like:
HTML：只需创建要放置消息的 de div，例如：
<div class="error"><b>ERROR:</b> The message goes here</div>
or for Notices:
或通知：
<div class="notice"><b>NOTICE:</b> The message goes here</div>
you can then style the classes using css.
然后，您可以使用 css 设置类的样式。
Hope this helps anyone.
希望这可以帮助任何人。
----------------------------------------- SOLUTION---------------------------------------
-----------------------------------------解决方案-------- -------------------------------
采纳答案by dSquared
There is no jQuery UI function to place an error on the page; however you can apply the error class using jQuery to elements like this:
没有 jQuery UI 函数在页面上放置错误；但是，您可以使用 jQuery 将错误类应用于如下元素：
$('#el').addClass('ui-state-error ui-corner-all'); // Rounded corners
$('#el').addClass('ui-state-error'); // Squared Corners
I hope this helps!
我希望这有帮助！
回答by Guillaume Cisco
According to the documentation, after loading Jquery UI css, you can use some classes :
根据文档，加载 Jquery UI css 后，您可以使用一些类：
http://jqueryui.com/docs/Theming/API
http://jqueryui.com/docs/Theming/API
For example, here the alert box is defined like that :
例如，这里的警报框定义如下：
<div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
<p>
<span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
<strong>Alert:</strong>
Sample ui-state-error style.
</p>
</div>
