如何更改按鈕的樣式？

Question

在一個頁面上，我試圖讓頁面頂部的按鈕變成方形和藍色。 為此有一個 jQuery 文件，但由於某種原因它不起作用。 這是以下代碼：

 $(document).ready(function() {
$("button").button();
 });

jQuery 文件：

<script src="/jquery_custom/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/jquery_custom/js/jquery-ui-1.8.7.custom.min.js" type="text/javascript"></script>
<link href="/jquery_custom/css/style.css" rel="stylesheet" type="text/css" />
<link href="/jquery_custom/css/fc-blue/jquery-ui-1.8.7.custom.css" rel="stylesheet" type="text/css" />

左側是我想要獲得的外觀，但我一直在右側獲得標准按鈕。 我究竟做錯了什么？ （文件路徑也正確）

Answer 1

根據您定義按鈕的標記，選擇器可以是：

$("button").button();

或者

$("input:submit").button()

你能告訴我們你用什么標記來添加按鈕嗎？

剛剛檢查了您的頁面的來源。

你有 jQueryUI 自定義包。 您確定在其中包含按鈕小部件嗎？

如果您檢查頁面錯誤，您會看到

Error: $("button").button is not a function
Source File: http://friendsconnect.org/scrapbook-booth/
Line: 25

這意味着 javascript，未加載定義 button() 方法。 確保您的自定義包包含按鈕小部件。

您的啟動 function 寫入不正確。 用這個替換你的腳本：

$(function () {
    $("button").button();
    $("#radio").buttonset();
    $("input:button").button();
    $("textarea").elastic();

    // Start FriendsConnect rounded corners
    settings = {
        tl: { radius: 5 },
        tr: { radius: 5 },
        bl: { radius: 5 },
        br: { radius: 5 },
        antiAlias: true,
        autoPad: false,
        validTags: ["div"]
    }
    $('#search-main').corner(settings);
    $('#infobox_right').corner(settings);
    // End FriendsConnect rounded corners
  });

你現在有

$(document).ready(function(){
    //Some code
    $(function(){
        //other code
    });
});

$(document).ready(function(){})和$(function(){})是相同的，並且只能（更正：如果它只出現一次就好了）在頁面上出現一次