jquery - 如何使用 CSS 设置警告框的样式？

Question

-- 更新--我已经阅读了很多关于这个主题的文章，尝试了一些脚本，需要帮助来找出你能做什么或不能做什么。社区回答了这一切，以下是一个很好的起点。 (这里的答案摘自下面的社区，谢谢)

1. 您不能覆盖默认的提醒方式。它由您的客​​户端(例如 chrome firefox 等)生成

2. 您可以改用 jquery。而不是使用如下脚本:

   函数 check_domain_input() { var domain_val = document.getElementsByName('域'); 如果(domain_val[0].value.length > 0){ 返回真； } alert('请输入要搜索的域名。'); 返回假；

这使得客户端(firefox chrome 等)产生一个警告框。

2b。您告诉代码是否需要在事件加载时发生某些事情 jquery alertbox 可以使它变得漂亮:(由 Jonathan Payne 回答并由 Jonathan Payne 创建。谢谢)

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css" type="text/css" media="all" />

<div onclick="check_domain_input()">Click</div>

<div id="dialog" title="Attention!" style="display:none">
    Please enter a domain name to search for.
</div>

<script>
    function check_domain_input()
    {        
        $( "#dialog" ).dialog(); // Shows the new alert box.

        var domain_val = document.getElementsByName('domain');

        if (domain_val[0].value.length > 0)
        {
            return true;
        }

        $( "#dialog" ).dialog();

        return false;
    }
</script>

在这里查看 jsFiddle:http://jsfiddle.net/8cypx/12/

Answer 1

尝试位于此处的 jQuery UI:http://jqueryui.com/demos/dialog/

它们有一个主题滚轮，您可以在其中设置对话框和模式框的样式。

-- 编辑--

回答你的第二个问题。

在这里查看 jsFiddle:http://jsfiddle.net/8cypx/12/

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css" type="text/css" media="all" />

<div onclick="check_domain_input()">Click</div>

<div id="dialog" title="Attention!" style="display:none">
    Please enter a domain name to search for.
</div>

<script>
    function check_domain_input()
    {        
        $( "#dialog" ).dialog(); // Shows the new alert box.

        var domain_val = document.getElementsByName('domain');

        if (domain_val[0].value.length > 0)
        {
            return true;
        }

        $( "#dialog" ).dialog();

        return false;
    }
</script>