使用jQuery和一個單擊事件爲CSS中的多個不同的ID賦予不同的屬性

我看起來很高，也很低。有一個點擊一個CSS元素改變單個屬性，或者改變一個CSS元素中的多個屬性，或者改變一個類改變的答案 - 但所有這些都是線性的。使用jQuery和一個單擊事件爲CSS中的多個不同的ID賦予不同的屬性

我想要一個單擊事件，其中，例如，我點擊了一個按鈕（或鏈接等），我已經設置。我們來調用這個ID #myClickButton。然後這個按鈕應該將兩個單獨的id的css屬性更改爲兩個不同的值。我們將調用這些ID＃myCssChange1和＃myCssChange2。

我點擊#myClickButton。然後＃myCssChange1從display：block; - > display：none; ＃myCssChange2從display：none; - >顯示：[novaluehere];

這些必須同時發生（或儘可能接近計算機執行代碼所需的分步操作）。

我敢肯定，這是非常簡單的...我只是希望爲它找到了jQuery（不是CSS或HTML）

到目前爲止我的代碼（是的，我意識到這是不正確 - 這是行不通的，但它確實隱藏了第一CSS，所以它的一部分功能）：

$(document).ready(function() 
     { 
     $("#myClickButton").click(function() 
      { 
      $("#myCssChange1").css('display', 'none'); 
      $("#myCssChange2").css('display', ''); 
      } 
     ); 
     } 
    );

來源

2012-11-14 Donovan Kelorii

你的代碼是正確的，雖然第二個應該是「內嵌」或「塊」，這取決於元素是什麼。 –

是的，將顯示屬性設置爲空白無效。見http://www.w3.org/wiki/CSS/Properties/display –

通常在jQuery中使用'.hide（）'和'.show（）'。這些方法將爲元素找出合適的CSS。 – Barmar

關閉，你需要指定比''其他事情來改變顯示器。

$(document).ready(function(){ 
    $("#myClickButton").click(function(){ 
     $("#myCssChange1").css('display', 'none'); 
     $("#myCssChange2").css('display', 'block'); // or inline, etc 
    }); 
});

來源

2012-11-14 19:48:11

你的代碼實際上是功能性的（假設你試圖放棄像沒有設置的顯示值）。這裏是running as a JSFiddle。我猜你要麼不加載JQuery，要麼在HTML中使用不同於上面描述的ID，如果它不適合你。另外，如果你只是顯示和隱藏元素，jQuery爲此提供了方法。它們非常有用，只是show()和hide()。

來源

2012-11-14 19:57:02

首先 - 謝謝大家的回覆。知道我的代碼（主要）功能是一個大的幫助（因爲我教我自己，我經常讓自己瘋狂）。外部資源同樣是一個很大的幫助。

我不知道我無法返回一個沒有價值的CSS。學過的知識。然而，爲了增加一些清晰度，這個特定的問題是最初可見的第一個對象（＃myCssChange1）是一個帶有文本塊的div。最初隱藏的第二個對象（＃myCssChange2）是一個包含表格的div。無論出於何種原因，對於＃myCssChange2表將「display」設置爲「none」以外的任何內容導致壓縮的DIV關閉到拒絕展開以顯示錶的一側（基本上，沒有任何內容的閉合條）。

我意外地發現了另一個選項，這要歸功於提到.hide（）和.show（）建議，並且這是在CSS中使用「可見性」而不是顯示。這解決了我所產生的HTML輸出的問題。

所以我用：

$(document).ready(function() 
     {$("#myClickButton").click(function() 
      {$("#myCssChange1").css('visibility', 'hidden'); 
      $("#myCssChange2").css('visibility', 'visible'); 
      }); 
     });

這似乎是多一點寬容，而不是很靈活，因爲顯示器，它處理的扭結很好。

非常感謝大家，如果沒有您的所有投入，我會至少再待上一週。

來源

2012-11-15 03:50:47

使用jQuery和一個單擊事件爲CSS中的多個不同的ID賦予不同的屬性

回答

相關問題