javascript自制單選按鈕不工作

我有這個JS爲我自己的單選按鈕;但似乎並不奏效;控制檯日誌本：未捕獲的語法錯誤：上線14javascript自制單選按鈕不工作

意外令牌}這是我使用的代碼：

$(document).ready(function(){ 
    $('.choise').click(function(){ 

     $(this).css({"background":"#58D998"}); 

     }); 
    if ($('.choise').css({"background":"#58D998"})) 
      { 

      $('.choise').click(function() 
       { 
       $(this).css({"background":"rgba(0, 0, 0, 0.7)"}); 
       } 
      } 
     ); 

);

我想這個代碼是工作如下：當首次點擊一個按鈕，使背景顏色爲X.第二次點擊時，將其更改爲Y.

來源

2013-07-30 user1952088

DEMO

$(document).ready(function() { 
    $('.choise').click(function() { 
     $(this).css({ 
      "background": "#58D998" 
     }); 

     if ($('.choise').css({ 
      "background": "#58D998" 
     })) { 
      $('.choise').click(function() { 
       $(this).css({ 
        "background": "rgba(0, 0, 0, 0.7)" 
       }); 
      }); 
     } 
    }); 
});

來源

2013-07-30 16:14:15

對不起，不起作用:( – user1952088

檢查出新的工作演示 –

是的！非常感謝：D – user1952088

您的第二個click處理程序中有太多的}。

這就是說，你的代碼是醜陋的，非常錯誤的。它不會切換。

爲什麼你不這樣做？

<label class="choice"><input type="radio" /><span>Click here!</span></label> 
<label class="choice"><input type="radio" /><span>Or here!</span></label>

而這個CSS：

label.choice>input[type=radio] {display:none} 
label.choice>input[type=radio]:checked~span {background:#58D998}

來源

2013-07-30 16:11:03

嗨，謝謝！因爲我不想要一個真正的單選按鈕，而是一個按鈕。我對JS和jQuery很陌生。你能向我解釋什麼是錯的/醜陋的嗎？ – user1952088

btw，第二個點擊處理程序，有一個用於if/else語句，另一個用於該功能，對吧？ – user1952088

[Demo]（http://jsfiddle.net/Ujx6e/） - 沒有可見的單選按鈕，只是像他們一樣的按鈕。 –

答案很簡單：

Simple Answer, Look at the console

更多詳細信息：

你緊箍咒是在錯誤的地方。您的代碼應閱讀：

$(document).ready(function(){ 
    $('.choise').click(function(){ 

     $(this).css({"background":"#58D998"}); 

     }); 
    if ($('.choise').css({"background":"#58D998"})) 
     { 

      $('.choise').click(function() 
       { 
       $(this).css({"background":"rgba(0, 0, 0, 0.7)"}); 
       } 
      ); 
     } 


);

正如其他人所指出的，雖然，這可能不是去了解事物的最好方式。

來源

2013-07-30 16:26:53

嘿，非常感謝！我對JS和jQuery非常陌生，請告訴我這是爲什麼？我沒有關於寫好或醜陋的線索...... – user1952088

嘗試使用記事本++。在那裏你可以匹配大括號{}。所以你永遠不會再陷入這種問題。 http://notepad-plus-plus.org/download/v6.4.3.html –

首先，你有過多的嵌套（代碼在代碼中），這使得代碼難以閱讀，跟隨和調試。其次，你應該儘可能少地使用字符串文字和對象文字，這就是所謂的DRY（不要重複自己）代碼的一部分。第三，造型屬於樣式表。切換類，而不是屬性。這有助於強化DRY代碼。第四，這段代碼比需要的時間要長，這會增加加載時間和處理時間，以及錯誤的可能性和調試的困難，在這種情況下，由於代碼很小，所以最好的做法是要擴展。 –

javascript自制單選按鈕不工作

回答

相關問題