2016-07-06 25 views
-1

ボタンを一度クリックすると、ボタンの境界線を変更して、もう一度クリックすると元の状態に戻ります。ボタンのクリックの境界線の色を変更する

HTML ...私は同じclass.Soで16のボタンを持っているので、私はなど、同じ時間に、彼らから5でクリックすることを可能にする場合、またはすべての(私はそれをクリックした場合のみ)

<button onclick="TogglePkgGroups('M16.1')" class="pool" id="M16.1">M16.1</button> 
<button onclick="TogglePkgGroups('M16.2')" class="pool" id="M16.2">M16.2</button> 
<button onclick="TogglePkgGroups('M17')" class="pool" id="M17">M17</button> 
<button onclick="TogglePkgGroups('MR17')" class="pool" id="MR17">MR17</button> 
<button onclick="TogglePkgGroups('MSS16c')" class="pool" id="MSS16c">MSS16c</button> 
<button onclick="TogglePkgGroups('MSS17')" class="pool" id="MSS17">MSS17</button> 
<button onclick="TogglePkgGroups('MSS17c')" class="pool" id="MSS17c">MSS17c</button> 
<button onclick="TogglePkgGroups('T15.0')" class="pool" id="T15.0">T15.0</button> 
<button onclick="TogglePkgGroups('T15.0c')" class="pool" id="T15.0c">T15.0c</button> 
<button onclick="TogglePkgGroups('T15.5')" class="pool" id="T15.5">T15.5</button> 
<button onclick="TogglePkgGroups('T15.5c')" class="pool" id="T15.5c">T15.5c</button> 
<button onclick="TogglePkgGroups('T15.8')" class="pool" id="T15.8">T15.8</button> 
<button onclick="TogglePkgGroups('T15.8c')" class="pool" id="T15.8c">T15.8c</button> 
<button onclick="TogglePkgGroups('T16.2')" class="pool" id="T16.2">T16.2</button> 
<button onclick="TogglePkgGroups('T16.2c')" class="pool" id="T16.2c">T16.2c</button> 
<button onclick="TogglePkgGroups('T16.5')" class="pool" id="T16.5">T16.5</button> 
+1

http://api.jquery.com/click&http://api.jquery.com/toggleclass –

+0

これを実現するには、これらが有効な_'identifier'_ – Rayon

+0

'toggleClass'であることが疑わしく、そのクラスに' border :1px solid#color; '#colorをcolor codeに置き換えます。 OPがHTML5を使用していて、それが有効であれば、@ RayonのJquery APIドキュメント –

答えて

0
<button class="pool" id="M16.1">M16.1</button> 
<button class="pool" id="M16.2">M16.2</button> 
<button class="pool" id="M17">M17</button> 
<button class="pool" id="MR17">MR17</button> 
<button class="pool" id="MSS16c">MSS16c</button> 
<button class="pool" id="MSS17">MSS17</button> 
<button class="pool" id="MSS17c">MSS17c</button> 
<button class="pool" id="T15.0">T15.0</button> 
<button class="pool" id="T15.0c">T15.0c</button> 
<button class="pool" id="T15.5">T15.5</button> 
<button class="pool" id="T15.5c">T15.5c</button> 
<button class="pool" id="T15.8">T15.8</button> 
<button class="pool" id="T15.8c">T15.8c</button> 
<button class="pool" id="T16.2">T16.2</button> 
<button class="pool" id="T16.2c">T16.2c</button> 
<button class="pool" id="T16.5">T16.5</button> 

スクリプト:select-poolため

$(function(){ 
$(this).click(function(){ 
    $($this).toogleClass('select-pool'); 
}); 
}); 

とCSS:

.select-pool{ 
    border-color: red/*chabge it according your color*/ 
} 
関連する問題