按鈕組使用JQuery更改功能

-2

我有一個按鈕組和一個on.click函數它正在工作。但與on.change不同。按鈕組使用JQuery更改功能

  <div class="ui buttons"> 
       <button class="ui button">Value 1</button> 
       <button class="ui button">Value 2</button> 
       <button class="ui button">Value 3</button> 
      </div>

這裏是我的功能

$('.ui.button').on('click change', function(){ 
    alert(...) 
});

當我使用這個沒有點擊，它不工作。

來源

2015-08-09 Wolfgang Müller

以及如何將onchange事件被觸發？ – Chris

按鈕沒有onchange事件！ – CyC0der

正如評論中指出的那樣，按鈕沒有on change事件，但是如果你想在onclick和onchange事件中使用某些東西，我可以推薦一個radio按鈕嗎？

來源

2015-08-09 14:22:09

好吧..是的，我已經改變它到收音機。我用buttonset試過，因爲它看起來更好看。我正在使用semantic-ui –

@WolfgangMüller您可以設置單選按鈕的樣式，使其看起來像一個按鈕，請參閱我的答案。 – zer00ne

您可以將單選按鈕樣式設置爲普通按鈕。

見POST

body { font: 400 16px/1.45 "Palatino Linotype"; } 
 
.buttons { 
 
    margin: 4px; 
 
    float: left; 
 
    border-radius: 12px; 
 
    font-variant: small-caps; 
 
} 
 
.buttons .button { 
 
    float: left; 
 
    width: 70px; 
 
    margin: 4px; 
 
    background-color: #111; 
 
    border-radius: 6px; 
 
    border: 1px solid #0FF; 
 
    overflow: auto; 
 
} 
 
.buttons .button span { 
 
    text-align: center; 
 
    font-size: 16px; 
 
    padding: 4px 0px; 
 
    display: block; 
 
} 
 
.buttons .button .check { 
 
    position: absolute; 
 
    top: -20px; 
 
} 
 
.buttons .check:checked + span { 
 
    background-color: #0FF; 
 
    color: #111; 
 
    border: 1px solid #0FF; 
 
} 
 
.buttons .button { 
 
    background-color: #111; 
 
    color: #0FF; 
 
}

<fieldset class="ui buttons"> 
 
    <label class="ui button"> 
 
    <input type="radio" class="check" name="toggle"><span>Value 1</span> 
 
    </label> 
 
    <label class="ui button"> 
 
    <input type="radio" class="check" name="toggle"><span>Value 2</span> 
 
    </label> 
 
    <label class="ui button"> 
 
    <input type="radio" class="check" name="toggle"><span>Value 3</span> 
 
    </label> 
 
</fieldset>

來源

2015-11-07 13:11:10 zer00ne

按鈕組使用JQuery更改功能

回答

相關問題