Question

我正在尝试制作一个“手动覆盖”按钮，允许用户手动填写字段的形式，而无需自动完成或浏览器为它们进行数学运算。我想要一个按钮，如果留在“否”，将运行JS，但如果没有将提醒他们，而不是运行JS代码。任何帮助，了解我如何处理这个错误将不胜感激！非常感谢你！

HTML：

    Manual Overide: 
            <label>No<input type="radio" name="manualOverride" 
                        id="manualOverrideNo" value="no" checked /></label>
            <label>Yes<input type="radio" name="manualOverride" 
                        id="manualOverrideYes" value="yes" /></label>

JS：

   //Manual Override Switch
$(document).ready(function() {
    if($('#manualOverrideNo').prop('checked')) {

//Code For Auto-complete

} else {
        alert("You have turned off Auto-complete");
    }
});

Answer 1

你已经解决了这个问题，你的if语句会在页面加载时立即开启，这可能不是你想要的 - 相反，你可能需要跟踪当前的设置某种方式和行为恰当，因此用户可以在运行时更改内容。

这是一种方法：

$(document).ready(function() {
    // var to hold state
    var isManual = false;

    // listener to update state
    $('input[name="manualOverride"]').click(function() {
        isManual = $(this).val() === 'yes';
    });

    // now, in your handlers for the input
    $('#userInput').focus(function() {
        if (isManual) {
            // let the user do things manually
        } else {
            // do automatic stuff
        }
    })
});

看一个小提琴：http://jsfiddle.net/4Ff8w/1/

Answer 2

您的代码在JSFIDDLE中运行良好：http://jsfiddle.net/9Aknj/

我不确定你的整个页面上下文，但是你可能只需要在需要处理它的事件处理程序的正确位置找到它，而不是让这些代码在DOM加载时执行。

Manual Overide set to NO: 
        <label>No<input type="radio" name="manualOverride" 
                    id="manualOverrideNo" value="no" checked /></label>
        <label>Yes<input type="radio" name="manualOverride" 
                    id="manualOverrideYes" value="yes" /></label>
<br/><br/>
Manual Overide not set to NO: 
        <label>No<input type="radio" name="manualOverride2" 
                    id="manualOverrideNo2" value="no" /></label>
        <label>Yes<input type="radio" name="manualOverride2" 
                    id="manualOverrideYes2" value="yes" checked /></label>

使用Javascript：

if($('#manualOverrideNo').prop('checked')) {
    //Code For Auto-complete
    alert("AUTOCOMPLETE CODE 1 DO HERE");
} else {
    alert("You have turned off Auto-complete IN FIRST CASE");
}

if($('#manualOverrideNo2').prop('checked')) {
    //Code For Auto-complete
    alert("AUTOCOMPLETE CODE 2 DO HERE");
} else {
    alert("You have turned off Auto-complete IN SECOND CASE");
}

更新：根据您最新的JSFIDDLE，我已将其修复为有效：http://jsfiddle.net/LQW6g/7/

基本上，这是附加KEYUP事件处理程序并为您执行计算的javascript：

if($('#manualOverrideNo').prop('checked')) {
    $('#footage').bind('keyup', function(){
        var footage = parseFloat($(':input[name="footage"]').val(),10);
        var total = '';
        if(!isNaN(footage)){
            total = Math.ceil(footage /7);
            $(':input[name="postQuantity"]').val(total.toString());
        } else {
            $(':input[name="postQuantity"]').val("");
            alert("You have input invalid number for footage.");
        }
    });
}

关闭JS代码的各个部分

2 个答案: