访问jQuery.each(）循环之外的变量

Access variables outside the jQuery .each() loop

本文关键字：变量 循环 jQuery each 访问      更新时间：2023-09-26

我有一个有点复杂的html结构。我解析它得到这样的东西：

Option1: value
Option2: value

从这个类似html:

<div class="option" id="option-691">
<span class="required">*</span>
<b>Option:</b><br>
<input type="radio" checked="" id="option-value-1250" value="1250" price="1156.0000" name="option[691]">
<label for="option-value-1250">2,35 xx - 1156.00 </label>
<br>
<input type="radio" onchange="recalculateprice();reloadpr();" id="option-value-1251" value="1251" price="506.0000" price_prefix="" points="0" name="option[691]">
<label for="option-value-1251">900 xx - 506.00</label>
<br>
</div>

这个也是

<div class="option" id="option-690">
<span class="required">*</span>
<b>Option:</b><br>
<select name="option[690]">
<option price="1156.0000" price_prefix="+" points="0" value="1249">value01
(+1156.00)
</option>
<option price="1156.0000" price_prefix="+" points="0" value="1248">value02
(+1156.00)
</option>
<option price="1156.0000" price_prefix="+" points="0" value="1247">value03
(+1156.00)
</option>
</select>
 </div>

使用它，我可以从这两种类型（输入+选择）中获取数据。

$('#product_options > div.option').each(function() {
 var Opt01 = ( $(this).find('option:selected').parent().parent().find('b').text() + $(this).find('option:selected').text() );
 var Opt02 = ( $(this).find('input:checked').parent().find('b').text() + $(this).find('input:checked').next().text() );
console.log(Opt01);
console.log(Opt02);
 });

但是，我想让Opt01和Opt02在.each（）循环之外。我该怎么做？

函数内声明的变量不能在函数外访问。只需在循环之外声明它们： 
var Opt01;
var Opt02;
$('#product_options > div.option').each(function() {
  Opt01 = ( $(this).find('option:selected').parent().parent().find('b').text() + $(this).find('option:selected').text() );
  Opt02 = ( $(this).find('input:checked').parent().find('b').text() + $(this).find('input:checked').next().text() );
  console.log(Opt01);
  console.log(Opt02);
 });

我想让Opt01和Opt02在.each（）循环之外

由于变量在该上下文中是本地的（通过使用var关键字），因此在each回调之外，变量是undefined。您可以在每次回调之外定义它们，例如var opt1, opt2;，但会发生什么呢？在每次迭代中，值都被覆盖，最后一个值获胜。如果选择器返回1个元素，那么首先就不应该使用each。

您可以定义一个函数并将值传递给它

$('#product_options > div.option').each(function() {
    var Opt1 = '...';
    var Opt2 = '...';
    doSomething(Opt1, Opt2);
});

或者使用map方法创建一个对象数组：

var options = $('#product_options > div.option').map(function() {
    var opt01 = '...';
    var opt02 = '...';
    return {
       opt1: opt01,
       opt2: opt02
    }
}).get();

只需在每个循环之外声明变量。函数内部声明的变量只能从内部访问。Js报价

var Opt01, Opt02; 
function find(){
    $('#product_options > div.option').each(function() {
      var option1 = ( $(this).find('option:selected').parent().parent().find('b').text() +              $(this).find('option:selected').text() );
      var option2 = ( $(this).find('input:checked').parent().find('b').text() +      $(this).find('input:checked').next().text() );
      if(option1){ 
          Opt01 = option1;  
          console.log("inside: "+Opt01);
      }
      if(option2){  
          Opt02 = option2; 
          console.log("inside: "+Opt02); 
      }              
  });
  console.log("outside: "+Opt01);
  console.log("outside: "+Opt02);
}

它非常简单，
您必须将函数外的变量声明为全局变量
但不要只声明，指定一些值
变量opt1=0；

谢谢大家。到目前为止，我在循环和代码之前添加了另一个验证规则。它运行良好：

if ($('#product_options div.option').length) {
  $('#product_options > div.option').each(function () {
//defining
OptionTitle = $(this).find('option:selected').parent().parent().find('b').text();
OptionValue = $(this).find('option:selected').text();
InputTitle = $(this).find('input:checked').parent().find('b').text();
InputValue = $(this).find('input:checked').next().text();
//
if (OptionTitle != '' && OptionValue != '') {
  Opt01 = (OptionTitle + OptionValue)
}
if (InputTitle != '' && InputValue != '') {
  Opt02 = (InputTitle + InputValue)
}
  });
  //get values outside the loop
console.log('Options detected');
if (typeof Opt01 === 'undefined') {
Opt01 = ''
}
if (typeof Opt02 === 'undefined') {
Opt02 = ''
}
  console.log('Opt01 = ' + Opt01);
  console.log('Opt02 = ' + Opt02);
} 
else {
console.log('Options are empty');
var Opt01 = '';
var Opt02 = '';
 console.log('Opt01 = ' + Opt01);
 console.log('Opt02 = ' + Opt02);
 }

还有小提琴在这儿http://jsfiddle.net/caLj2xbe/

相关文章：