将Click事件附加到Bootstrap切换单选按钮

时间:2016-07-28 19:37:54

标签: javascript jquery twitter-bootstrap-3 jquery-2.0

我有一个带有下面代码的boostrap切换。它在视觉上正常工作

<div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary active">
            <input type="radio" name="options" id="showBuildQuantity" autocomplete="off" checked>Build Quantity
        </label>
        <label class="btn btn-primary">
            <input type="radio" name="options" id="showNumberOfScreens" autocomplete="off" onclick="showBuildQuantity()">Number of Screens
        </label>
    </div>

下面我有一些代码来处理点击事件:

$(document).ready(function () {
    $('#showBuildQuantity').on('click', function () {
        <code here>
    });

    $('#showNumberOfScreens').on('click', function () {
        <code here>
    });
});

我遇到的问题是,当我点击切换按钮时,点击事件永远不会运行。

我在同一页面上使用相同类型的jQuery点击事件有其他按钮,但它们没有问题。

1 个答案:

答案 0 :(得分:4)

经过一些研究后,我发现我需要使用更改而不是点击。所以代码应该是这样的:

$('#showBuildQuantity').on('change', function () {
    if (myChart != null) {
        myChart.destroy();
    }
    setChart(getBuildQuantityData);
});

$('#showNumberOfScreens').on('change', function () {
    if (myChart != null) {
        myChart.destroy();
    }
    setChart(getNumScreensData);
});