Question

想知道是否有人可以帮助我的代码。我一直试图让它一整天都工作，我不知道为什么代码不工作:(。所以代码应该帮助用户在游戏中选择一个字符来编码4问题。用户通过单选按钮输入答案。

这是HTML：

    <h2> What Champion Should You Play?</h2>
<h3>
    What Lane do You Want to Play?
</h3>
<form onsubmit="getImg()" method="post">
<p> Top </p> <img src="http://img10.deviantart.net/d268/i/2014/226/e/a/gnar__by_dukeofdunkshire-d7v6rgm.jpg"> <input type="radio" name="Lane" value="Top" id="11">
<p> Mid </p><img src="http://www.solomidcdn.com/images/champions/velkoz.png"><input type="radio" name="Lane"  value="Mid" id="12">
<p> Jungle</p><img src="https://pbs.twimg.com/media/CF4vu3ZW0AEwR0M.png"><input type="radio" name="Lane" value="Jungle" id="13">
<p> ADC</p><img src="http://img.dwstatic.com/huyaedg/img/hero/Caitlyn.png"><input type="radio" name="Lane" value="Adc" id="14">
<p> Support</p><img src="http://i.imgur.com/2kwycth.png"> <input type="radio" name="Lane" value="Support">


<h3>
    What Role do You Want to Play?
</h3>
   <p>Assassin</p> <img src="http://vignette3.wikia.nocookie.net/leagueoflegends/images/3/39/Assassin_icon.jpg/revision/20140607013330"> <input type="radio" name="Role" value="Assasin" id="21">
    <p>Tank</p><img src="http://3.bp.blogspot.com/--M5c7oXkX6A/U4_N5v-mLjI/AAAAAAAAQ6g/hduKMsQwSX4/s1600/profileIcon662.jpg"> <input type="radio" name="Role" value="Tank" id="22">
    <p>Bruiser</p><img src="http://4.bp.blogspot.com/-ZGQQg_79y48/U4-_zTlXL3I/AAAAAAAAQ4g/wnwOyxJ_Ml0/s1600/profileIcon658.jpg"> <input type="radio" name="Role" value="Bruiser" id= "23">
    <p>Marksman</p><img src="http://3.bp.blogspot.com/-nT8UdY4SZao/U4-_zr_SKQI/AAAAAAAAQ4o/suUj5L2NmFc/s1600/profileIcon660.jpg"> <input type="radio" name="Role" value="Marksman" id= "24">
    <p>Mage</p><img src="http://3.bp.blogspot.com/-pL_H0M6kCtM/U4-_zXyUA6I/AAAAAAAAQ5A/sFrySjxNBsc/s1600/profileIcon659.jpg"> <input type="radio" name="Role" value="Mage" id="25">

<h3>
    Do You Want to Piss People off with Cheese?
</h3>

<p>Yes</p><img src="http://www.clker.com/cliparts/O/k/f/l/4/0/cheese-hi.png"> <input type="radio" name="Cheese" value="Yes" id="31">
<p>No</p><img src="http://assets4.tribesports.com/system/challenges/images/000/023/603/original/20120723031440-no-cheese-for-one-week.jpg"> <input type="radio" name="Cheese" value="No" id="32">
<h3>
    Mad Plays or Easy Days?
</h3>
    <p> Mad Plays</p><img src="http://pre12.deviantart.net/4280/th/pre/i/2014/012/3/b/chibi_thresh_by_koiyaki-d71x098.png"><input type="radio" name="Plays" value="Yes" id="41">
    <p> Easy Days</p><img src="http://img3.wikia.nocookie.net/__cb20140807150704/leagueoflegends/images/3/3a/Warwick_Render.png"><input type="radio" name="Plays" value="No" id="42">

    <input type="submit" value="Submit">

这是JavaScript，它应该得到单选按钮的答案，如果选中了单选框，它会添加＆＃39; 1＆＃39;到了＃pic;＆＃39;字符串，如果没有它添加＆＃39; 2＆＃39;。最后，它应该打开一个窗口，其中包含照片＆＃39;在2个字符串之间形成一个URL。如果我把'window.open＆＃39;在第一个for循环的其他括号中，它适用于前5个数字（打开4个标签）。

    function getImg()
    {
       var radio1 = document.getElementsByName('Lane');
        var radio2 = document.getElementsByName('Role');
        var radio3 = document.getElementsByName('Cheese');
        var radio4 = document.getElementsByName('Plays');
        var pic = '';

          for (var i = 0; i < 6; i++) {
                if (radio1[i].checked) {
                    pic += '1';

                }
                else {
                    pic += '2';

                }
            }
            for (var i2 = 0; i2 < 6; i2++)
            {
                if(radio2[i2].checked)
                {
                    pic += '1';
                }
                else {
                    pic += '2';

                }
            }
        for (var i3 = 0; i3 < 2; i3++)
        {
            if(radio3[i3].checked)
            {
                pic += '1';
            }
            else {
                pic += '2';

            }
        }
        for (var i4 = 0; i4 < 2; i4++)
        {
            if(radio4[i4].checked)
            {
                pic += '1';
            }
            else {
                pic += '2';

            }
        }

            window.open('http://lmetar.com/' + pic + '.png');

    }

提前感谢任何有能力帮助我的人。

Answer 1

你错误地计算了放射性物质的数量。不要指望自己，让计算机去做，这就是他们的目标！

  function getImg() {
    var radio1 = document.getElementsByName('Lane');
    var radio2 = document.getElementsByName('Role');
    var radio3 = document.getElementsByName('Cheese');
    var radio4 = document.getElementsByName('Plays');
    var pic = '';
    for (var i = 0; i < radio1.length; i++) {
      // shortcut for your if...else construct
      pic += radio1[i].checked ? '1' : '2';
    }
    for (var i = 0; i < radio2.length; i++) {
      pic += radio2[i].checked ? '1' : '2';
    }
    for (var i = 0; i < radio3.length; i++) {
      pic += radio3[i].checked ? '1' : '2';
    }
    for (var i = 0; i < radio4.length; i++) {
      pic += radio4[i].checked ? '1' : '2';
    }
    window.open('http://lmetar.com/' + pic + '.png');

  }

函数document.getElementsByName()会返回一个列表，您可以使用LIST.length确定其长度，此处为：radioX.length。

JavaScript和字符串操作中的Radio Boxes

1 个答案: