2015-05-28 27 views
35

Ben radyo düğmeleri ile test edilmiştir 'için' beklenmedik. Her şey JS lint'ten geçene kadar iyi görünüyor. JSLint:

/*global body,window,document,alert*/ 
(function() { 
"use strict"; 

var UIlogic; 

UIlogic = { 
    myLoad: function() { 
     var elems, elemText, btn1, winter, summer, fall, spring, header, btns; 

     winter = "<div><input type='radio' name='cb' id='cbA' value='0'/><label for='cbA'>Winter</label></div>"; 
     summer = "<div><input type='radio' name='cb' id='cbB' value='1'/><label for='cbB'>Summer</label></div>"; 
     fall = "<div><input type='radio' name='cb' id='cbC' value='2'/><label for='cbC'>Fall</label></div>"; 
     spring = "<div><input type='radio' name='cb' id='cbD' value='3'/><label for='cbD'>Spring</label></div>"; 

     header = "Header"; 

     btns = "<br /><button class='btns' id='btn1'>Go!</button>"; 

     elemText = "Menu/nav"; 

     elems = "<center><div>" + header + "</div></center>";//title 
     elems += "<div>" + elemText + "</div></center>";//menu 
     elems += "<div id='container'><br />";//container opens 
     elems += "<div id='div1'>" + winter + "</div>"; 
     elems += "<div id='div2'>" + summer + "</div>"; 
     elems += "<div id='div2'>" + fall + "</div>"; 
     elems += "<div id='div2'>" + spring + "</div>"; 
     elems += "<div id='div3'>" + btns + "</div>"; 
     elems += "</div>";//container closes 
     elems += "<h6><div id='footer'>Ehawk 2015</div></h6>"; 

     body.innerHTML = elems; 
     btn1 = document.getElementById("btn1"); 
     btn1.addEventListener('click', UIlogic.intoFunction, false); 

    }, 
    intoFunction: function() { 
     var radios, found, i = 0; 
     radios = document.getElementsByName("cb"); 
     found = 1; 
     for (i = 0; i < radios.length; i += 1) {//issue occurs here 
      if (radios[i].checked) { 
       alert(radios[i].value); 
       found = 0; 
       break; 
      } 
     } 
     if (found === 1) { 
      alert("Please Select Radio"); 
     } 
    } 
}; 
window.onload = function() { 
    UIlogic.myLoad(); 
}; 
}()); 

ben yanlış benim döngü çalışan muyum: my JavaScript İşte

for (i = 0; i < radios.length; i += 1) { 

'için'

Beklenmedik: Ben biri hariç tüm hataları düzeltmenize? JSlint neden burada bir problem görüyordu kod bile işe yaradı? Onlarla ilgili en fazla meseleye sahip olduğum için döngüler hakkında biraz bilgi sahibi olabilirim. Onları kullanmamam söylendi, ancak radyo düğmelerini ve kontrol edilen radyoları tespit etmek için bir döngü çalışması ile ilgili problemi görmüyorum. İlgilendiğim bir şey mi?

+1

Bu uyarıyı bastırmak için seçenekler ifadesi için ... tahammül kontrol edebilirsiniz. –

+1

[Burada konuyla ilgili soru yerine javascript daha java etiketli olmasına rağmen, var] (http://stackoverflow.com/q/6850380/497418) – zzzzBov

+0

Ayrıca ([buradan] sorulan http://stackoverflow.com/questions/30265001/what -does-jslint-mean-by-beklenmedik ifade-i-in-deyim-pozisyon), başlık yanıltıcı olabilir olsa da. – ruffin

cevap

46

JSLint böyle forEach gibi diğer döngüler kullanmak önerir. http://www.jslint.com/help.html#for

Sadece bu sizi rahatsız ama kod düzgün görünüyorsa "ifadesi için" altındaki seçeneği tahammül seçebilir.

+1

İyi bul. Oradaki "kabul edilmiş cevap" için benim oyum. – garryp

+3

Bu öneriyle ilgili bir sorun var: orijinal "for" döngüsü ile kavramsal olarak yapıldığı için forEach() işlevini bozamazsınız. Bu durumda her() 'yi düşünün. – jdphenix

15

Here's the best explanation I could find for you ,

Son zamanlarda ben artık for kullanmak gerekmez karar verdi. for döngüler ile bitti. for döngüler icat edildi, Fortran'dan çıktılar. Onlar bir dizi boyunca çalışan bir yolu olması amaçlanmıştır, ancak ES5 biz forEach() ve map() ve diğerlerini eklendi, ben 'Evet, bunu yapmak için bir yoldur' gibiydi. for sözdizimi, içindeki üç ifadeyle ilgili olarak çok garip.

Crockford ayrıca, ES6'da döngü yapıları ile tamamlanmaktan ve bunun yerine yalnızca işlevsel yapılar kullanmaktan bahseder.

Bunu gözardı edebiliriz

- sadece for tolere jslint seçeneği geçmektedir.


Ancak, en uzağa sahip for döngü ile yapmaya karar diyelim. every() ile olabilir. Bu bir for döngü anlamak daha kolay ise

intoFunction: function() { 
    var radios, found; 
    radios = document.getElementsByName("cb"); 
    found = Array.prototype.slice.call(radios).every(function(radio) { 
     if (radio.checked) { 
      alert(radio.value); 
      return false; 
     } 
     return true; 
    }); 

    if (found) { 
     alert("Please Select Radio"); 
    } 
} 

Bence dürüst tartışılabilir: gibi bir şey (değil test) olacaktır. Dürüst olmak gerekirse, kendi kişisel/projenizin kodlama standartlarına bağlıdır.


Bunu gerçekleştirmek için every() gösteren bir çalışma snippet'iyle güncellendi.

function into() { 
 
    var radios, found; 
 
    radios = document.getElementsByName("cb"); 
 
    found = Array.prototype.slice.call(radios).every(function(radio) { 
 
    if (radio.checked) { 
 
     alert(radio.value); 
 
     return false; 
 
    } 
 
    return true; 
 
    }); 
 

 
    if (found) { 
 
    alert("Please Select Radio"); 
 
    } 
 
} 
 

 
jQuery("[name='cb']").on("click", into); 
 
jQuery("button").on("click", function() { 
 
    jQuery("[name='cb']").prop("checked", false); 
 
    into(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p> 
 
    <label> 
 
    <input type="radio" name="cb" value="M">Male</label> 
 
</p> 
 
<p> 
 
    <label> 
 
    <input type="radio" name="cb" value="F">Female</label> 
 
</p> 
 
<p> 
 
    <label> 
 
    <input type="radio" name="cb" value="I">I don't know</label> 
 
</p> 
 
<p> 
 
    <label> 
 
    <input type="radio" name="cb" value="B">Both</label> 
 
</p> 
 
<p> 
 
    <button>Clear Radios</button>

+0

sadece düzenlemenizi gördüm, bunu deneyeceğim. Teşekkürler! – MrEhawk82