Question

好的，所以我被抛出一个项目，我的js经验有限。我试图创建一个脚本，该脚本获取一些单选按钮点击和文本输入的结果，并将它们放在一起，以便将它们定向到。我的代码有点工作大声笑，但我知道必须有更清洁的方式。当我无法记住我是如何尝试这样做但它涉及document.getelementbyname（＆＃34; loc）.value但它返回undefined ..现在我试图用＆＃34;端口＆＃34做同样的事情;无线电我想做对。对不起，如果我把这篇文章搞砸了。

<label><input type="radio"   name="loc" value="16" onclick= "clt();" />Carolinas</label><br>
<label><input type="radio"   name="loc" value="17" onclick= "geo();"/>Georgia</label><br>
<label><input type="radio"   name="loc" value="18" onclick= "sxw();"/>Xpress</label><br><br>


<label><input type="number" placeholder="Store Number" id="thirdOct" /> </label>
<label><input type="radio" name="cwPort" value="90"/>Port 90</label>
<label><input type="radio" name="cwPort" value="91"/>Port 91</label>
<label><input type="radio" name="cwPort" value="92"/>Port 92</label>
<br>    
<input type="submit" class="fsSubmitButton" value="Connect" onclick="makeIp();" />



var ipAdd;
var sNum = "0";
var int = [":", 81 ];

// had to go this route for a value, because when I try to call by document.getElementByName("loc") in my makeIp function it returns undefined for the value of "loc" 





function clt()
{sNum = "16";}


function geo() 
{sNum = "17";}

function sxw ()
{ sNum = "18";}

function makeIp() 
{
var storeN = document.getElementById("thirdOct").value;
var octThree;
if (storeN >= 300 && storeN <= 399) {

            octThree = storeN.slice(-2);
        if (octThree < 10) { 
            octThree = storeN.slice(-1);
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0]  ,"_blank");
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0] );
                            }
        else { 
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0]  ,"_blank");
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0]  );
                                    }       

                            }
else {

        if (storeN >= 300) { 
            octThree = storeN.slice(-2);

            if (octThree < 10) { octThree = storeN.slice(-1);
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");

                                }

            else {
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
                        }
            }
        else { octThree = storeN; 
        var ipAdd    = "http://172." + sNum + "." + octThree + ".65" + int[0] + int[1] ;    
             console.log(ipAdd);
        window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
        console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");

       }
   }
}

所以我找到了一个可能的解决方案，使用以下代码替换我称为clt，geo和sxw ....的函数。

var radios = document.getElementsByName('genderS');

for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].checked) {
    // do whatever you want with the checked radio
    alert(radios[i].value);

    // only one radio can be logically checked, don't check the rest
    break;
}
}

Answer 1

我在答案字段中发布此内容，因此我可以向您显示代码，但我不太确定这是您的答案，因为您没有发布所有相关的原始代码。

我已修改您的代码以摆脱内联HTML事件处理程序和整合的冗余代码。我还纠正了一些错误，您将字符串值与数字进行比较：

  storeN >= 300 && storeN <= 399

和

  octThree < 10

var rads = document.querySelectorAll(input[type=radio]);
for(var i = 0; i < rads.length; ++i){
  rads[i].addEventListener("click", setVal);
}

var btn = document.querySelector(input[type=button]);
btn.addEventListener("click", makeIp);

var sNum = 0;
var int = [":", 81 ];
var ipAdd = null;

function setVal(){
    sNum = parseInt(this.value, 10);
}

function makeIp() {
  var strNum = document.getElementById("thirdOct").value;
  var storeNum = parseInt(strNum, 10);
  var octThree = null;
  
  if (storeNum >= 300 && storeNum <= 399) {
        octThree = parseInt(strNum.slice(-2), 10);
        if (octThree < 10) { 
            octThree = strNum.slice(-1);
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0]);
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0]);
                            }
        else { 
            window.open("http://172." + sNum + "." + octThree + ".65" + int[0]);
            console.log("http://172." + sNum + "." + octThree + ".65" + int[0]);
        }       

  } else {

        if (storeNum >= 300) { 
            parseInt(strNum.slice(-2), 10);

            if (octThree < 10) { 
              octThree = storeN.slice(-1);
              window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
              console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
            } else {
              window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
              console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
            }
  } else { 
    octThree = storeN; 
    var ipAdd    = "http://172." + sNum + "." + octThree + ".65" + int[0] + int[1] ;    
    console.log(ipAdd);
    window.open("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
    console.log("http://172." + sNum + "." + octThree + ".65" + int[0] + int[1],"_blank");
  }
}

<label><input type="radio" name="loc" value="16">Carolinas</label><br>
<label><input type="radio" name="loc" value="17">Georgia</label><br>
<label><input type="radio" name="loc" value="18">Xpress</label><br><br>

<label><input type="number" placeholder="Store Number" id="thirdOct" /> </label>
<label><input type="radio" name="cwPort" value="90">Port 90</label>
<label><input type="radio" name="cwPort" value="91">Port 91</label>
<label><input type="radio" name="cwPort" value="92">Port 92</label>
<br>    
<input type="button" class="fsSubmitButton" value="Connect">

单选按钮传递值时遇到问题

1 个答案: