-1

我正在制作一个小费计算器，一切正常，但如果选择了不同的评级，jQuery 不会更改公式；例如，差，好，好..

jsFiddle 演示:: http://jsfiddle.net/MatthewKosloski/g7vAQ/1/

        $('#tip').on('click', function(){

            if($('#poor').click && $('#amount').val().length){

                var theAmountVal = $('#amount').val();

                    alert(theAmountVal * .10);

            } else if($('#good').click && $('#amount').val().length){

                var theAmountVal = $('#amount').val();

                    alert(theAmountVal * .15);

            } else if($('#great').click && $('#amount').val().length){

                var theAmountVal = $('#amount').val();

                    alert(theAmountVal * .20);

            } else {

                    alert("An error has occured.");

            }
4

3 回答 3

3

这不是真正的.click工作方式......

.click是触发点击或添加事件绑定的函数。

您应该尝试这种情况（x3 适用于其他元素）：

if($('#poor').hasClass('active-state')&& $('#amount').val().length)

.hasClass将检查它是否有类并返回真或假。

这是文档.hasClass()：http ://api.jquery.com/hasClass/

另外，如果我能给你一个建议，你可以像这样在自定义属性中添加这个因素：

<h1 id="poor" data-factor='.10' data-clicked="false">Poor</h1>
<h1 id="good" data-factor='.15' data-clicked="false">Good</h1>
<h1 id="great" data-factor='.20' data-clicked="false">Great</h1>

并将您的代码简化为：

$('h1').on('click', function () {
    $(this).addClass('active-state').siblings('h1').removeClass('active-state');
});

$('#tip').on('click', function(){
    if($('.active-state').length && $('#amount').val().length){
        var theAmountVal = $('#amount').val();
        alert(theAmountVal * $('.active-state').data('factor'));
    }

});

小提琴：http: //jsfiddle.net/g7vAQ/5/

于 2013-07-14T20:54:47.753 回答
3

这是一个建议：
这里的演示

var choice;
$('h1').on('click', function () {
    choice = this.id;
    $(this).addClass('active-state').siblings('h1').removeClass('active-state');
});
$('#tip').on('click', function () {
    if (choice == 'poor' && $('#amount').val().length) {
        var theAmountVal = $('#amount').val();
        alert(theAmountVal * .10);
    } else if (choice == 'good' && $('#amount').val().length) {
        var theAmountVal = $('#amount').val();
            alert(theAmountVal * .15);
    } else if (choice == 'great' && $('#amount').val().length) {
            var theAmountVal = $('#amount').val();
        alert(theAmountVal * .20);
    } else {
        alert("An error has occured.");
    }
});

我得到了idclicked 选项并将其存储在 a 中variable，然后我使用了您的代码并重新检查id了if语句。

于 2013-07-14T20:55:20.683 回答
-2

尝试这个：

jQuery(document).ready(function () {
var theAmountVal=0;

        jQuery('#tip').onclick(function(){

            if($('#poor').click && $('#amount').val().length){

                theAmountVal = $('#amount').val();

                    alert(parseInt(theAmountVal)* .10);

            } else if($('#good').click && $('#amount').val().length){

                theAmountVal = $('#amount').val();

                    alert(parseInt(theAmountVal)* .15);

            } else if($('#great').click && $('#amount').val().length){

                theAmountVal = $('#amount').val();

                    alert(parseInt(theAmountVal)* .20);

            } else {

                    alert("An error has occured.");

            }

});

并从代码中删除此$('#good').click代码，并将其替换为其他内容。.Click - 是事件，不能在 IF..ELSE 结构中使用

于 2013-07-14T20:52:16.097 回答