如何使这个简单的Try / Catch测试工作？

Question

A user selects whether or not to run an alert line of code with an error using a radio button. The idea is the user selects a radio element, a function(setError()) is run that locates the selected radio button and then passes the value to another function (runCode()) that uses IF statements to decide whether or not to include errors in the alert. If the user chooses to alert with an error then a Try Catch code should capture the error and display the error in the

element already in the HTML.

<form name="Form">
       Run Code:
    <input type="radio" name="errorRad" onchange="setError()" value="yes">With Error
    <input type="radio" name="errorRad" onchange="setError()" value="no">Without Error
    </form>
        <p id="t">
        </p>

Script:

<script>


function setError() {
    var x;
 var rad = document.forms["Form"]["errorRad"];
    for (i = 0; i < rad.length; i++) {
    if (rad[i].checked){
    x = rad[i].value;
    }
    }
   runCode(x);

    }
       function runCode(error) {
   if (error == "yes") {
    try {
    allert(a successful alert box);
    } catch(err) {
    document.getElementById("t").innerHTML = err.message;
    }
    }else if (error == "no") {
    alert("a successful alert box");
    }

    }

</script>

Interestingly, after testing this by placing random alert boxes in during the code to test where the code gets up to before breaking: the code doesn't even seem to call the first function (setError). The onchange event doesn't seem to work properly. Perhaps by syntax is wrong or an alternative event is better. Another point of interest is the calling of the second function (runCode). I'm not too good at passing parameters in JavaScript (I'm not good at much tbh) and I'm not sure if my method will work.

JS Fiddle: http://jsfiddle.net/rwowf5j8/22/

Answer 1

Try this

var rad = document.forms["Form"]["errorRad"];

for (var i = 0; i < rad.length; i++) {
    rad[i].addEventListener('change', onChange);
}

function onChange(event) {
    //cast as bool
    if (!!event.target.value) {
        try {
            allert('a successful alert box');
        } catch(err) {
            document.getElementById("t").innerHTML = err.message;
        }
    } else {
        alert('a successful text box');   
    }
}

there are a few issues with your code, the allert will throw an undefined is not a function error, but passing in a successful alert box not as a string stops the code from running

fiddle - http://jsfiddle.net/rwowf5j8/24/

Answer 2

I changed your code a little bit, and removed your error with ...

alert("a successful alert box");

http://jsfiddle.net/f3b5kxx3/

But the rest was pretty fine.