使用不引人注目的JavaScript形成单选按钮_Javascript_Unobtrusive Javascript

使用不引人注目的JavaScript形成单选按钮

javascript

使用不引人注目的JavaScript形成单选按钮,javascript,unobtrusive-javascript,Javascript,Unobtrusive Javascript,如何将下面的代码转换为不引人注目的JavaScript <!DOCTYPE html> <html> <head> <title>title</title> <script type="text/javascript"> function ar_change(){ if (document.ar_form.ar_type[0].checked)

如何将下面的代码转换为不引人注目的JavaScript

<!DOCTYPE html>
<html>
<head>
    <title>title</title>
    <script type="text/javascript">
        function ar_change(){
            if (document.ar_form.ar_type[0].checked)
                var txt = "";
            else if (document.ar_form.ar_type[1].checked)
                var txt = "first text.";
            else if (document.ar_form.ar_type[2].checked)
                var txt = "second text.";
            else if (document.ar_form.ar_type[3].checked)
                var txt = "third text.";
            else if (document.ar_form.ar_type[4].checked)
                var txt = "forth text.";
            document.ar_form.ar_text.value=txt;
        }
    </script>
</head>
<body>
    <form name="ar_form" action="." method="post">
        <textarea name="ar_text"></textarea><br>
        <input type="radio" name="ar_type" value="0" onclick="ar_change()" checked>no text<br>
        <input type="radio" name="ar_type" value="1" onclick="ar_change()">text 1<br>
        <input type="radio" name="ar_type" value="2" onclick="ar_change()">text 2<br>
        <input type="radio" name="ar_type" value="3" onclick="ar_change()">text 3<br>
        <input type="radio" name="ar_type" value="4" onclick="ar_change()">text 4<br>
        <input type="submit" />
    </form>
</body>
</html>


标题
函数ar_change（）{
if（document.ar\u form.ar\u type[0]。选中）
var txt=“”；
else if（document.ar\u form.ar\u type[1]。选中）
var txt=“第一个文本。”；
else if（document.ar\u form.ar\u type[2]。选中）
var txt=“第二个文本。”；
else if（document.ar\u form.ar\u type[3]。选中）
var txt=“第三个文本。”；
else if（document.ar\u form.ar\u type[4]。选中）
var txt=“第四文本。”；
document.ar_form.ar_text.value=txt；
}


无文本

正文1

正文2

正文3

正文4

当用户选择Radio按钮时，此javascript会更改内容。当前的脚本正在运行，我想从标记中删除所有的“onclick”，并在使用js更改redio按钮时检查它。我该怎么做？

var-artexts=[
var artexts = [
    "",
    "first text.",
    "second text.",
    "third text.",
    "forth text."
];
ondocumentload(function() { // use any known library thing or your owns
    var radios = document.getElementsByName("ar_type");
    for (var i=0; i<radios.length; i++)
        radios[i].addEventListener("change", function() {
            for (var i=0; i<radios.length; i++)
                if (radios[i].checked)
                     document.getElementById('txtarea').value = artexts[radios[i].value];
        }, false);
});

"",
“第一个文本。”，
“第二个文本。”，
“第三文本。”，
“第四文本。”
];
ondocumentload（function（）{//使用任何已知的库或您自己的库
var radios=document.getElementsByName（“ar_类型”）；
对于（var i=0；i不需要更改表单（除去onclick处理程序除外）：
普通JS：

错误的选择器。getElementsByName（“art_type”）或getElementsByTagName（“input”）谢谢，我怎么能把它们混在一起：-（已修复。我如何使用JQuery实现这一点？
window.onload=function() {
  var rads = document.getElementsByName("ar_type");
  for (var i=0,n=rads.length;i<n;i++) {
    rads[i].onclick=function() {
      this.form.ar_text.value=["","first_txt","second_txt","third_txt","fourth_txt","fifth_txt"][this.value];
    }
    if (rads[i].checked) rads[i].click(); // set the value onload
  }
}

$(document).ready(function() {
  $('input[name=ar_type]:radio').click(function() {
    this.form.ar_text.value=["","first_txt","second_txt","third_txt","fourth_txt","fifth_txt"][this.value];
  });
    $('input[name=ar_type]:radio').filter(":checked").click(); // IMPORTANT!!!
});