jQuery：使用.text（）显示数组值

我想改变一些基于单选按钮选择使用jQuery的文本，但我似乎无法得到它的工作。这是我的代码，因为它代表：jQuery：使用.text（）显示数组值

HTML

<input type="radio" name="finish_id" id="1" value="1" checked /> 
<label for="1" id="veteran"></label> 

<input type="radio" name="finish_id" id="2" value="2" /> 
<label for="2" id="elite"></label> 

<input type="radio" name="finish_id" id="3" value="3" /> 
<label for="3" id="legendary"></label>

<span id="finish_name"></span>

// Set variables 
    var finish[] = "something"; 
    var finish[] = "something else"; 
    var finish[] = "another thing"; 

// Change finish name based on radio selection 
    $(document).ready(function() { 
     $("input[name='finish_id']").change(function() { 
      $('#finish_name').text(finish[$(this).val()]); 
     }).change(); 
    });

我可能路要走与数组数为$(this).val()，我不知道你是否可以这样选择，但即使我将其设置为$('#finish_name').text(finish[1]);我收到一个unexpected token [错误。如何使用.text（）的数组值？

来源

2013-02-26 Josh Mountain

的数组从0开始，所以让你的值为0,1,2 – 2013-02-26 18:28:14

添加元素到数组使用push。 finish.push（'你的var'）;并且在编写JavaScript代码时保持您的Firebug/Chrome开发者工具启用。 :) – HamidRaza 2013-02-26 18:32:30

我添加了一个html5风格的实现，如果您感兴趣，我的答案会更清晰。 – gbtimmon 2013-02-26 18:46:50

您有几个问题：

你不要在JavaScript中声明这样的数组。声明一个名为finish的变量。详细了解MDN's article上的阵列。
你有一个错误的错误。在JavaScript中，数组索引是基于0的，这意味着第一个索引是0.您可以通过从更改事件内部的单选按钮值中减去1来解决此问题。
手动触发更改事件的方式会导致事件触发最后一个单选按钮。您可以使用.first方法选择第一个单选按钮，并在该元素上仅触发的更改事件。

更新：更妙的是，你可以使用在checked单选按钮.filter只有呼叫改变（如下更新）

// Set variables 
var finish = ['something', 'something else', 'another thing']; 

// Change finish name based on radio selection 
$(document).ready(function() { 
    $("input[name='finish_id']").change(function() { 
     $('#finish_name').text(finish[$(this).val()-1]); 
    }).filter(":checked").change(); 
});

例子：http://jsfiddle.net/YnBa3/1/

来源

2013-02-26 18:32:45

谢谢，因为你可以告诉我相对较新的Javascript .. 你和@gbtimmon都是一个很好的帮助:) – 2013-02-26 18:34:33

@JoshMountain：没问题！每个人都是新的一次:)很高兴我能帮上忙。 – 2013-02-26 18:35:40

那不是你如何声明数组在javascript

尝试

var finish = ["something", 
       "something else", 
       "another thing"]; 


// Change finish name based on radio selection 
$(document).ready(function() { 
    $("input[name='finish_id']").change(function() { 
     $('#finish_name').text(finish[$(this).val()]); 
    }).change(); 
});

或者使其更具可扩展性/ HTML5去年秋季....

<input type="radio" name="finish_id" value="1" data-message='something' onchange="javasript:$('#finish_name').text(finish[$(this).val()])"> 
<input type="radio" name="finish_id" value="2" data-message='something else' onchange="javasript:$('#finish_name').text(finish[$(this).val()])"> 
<input type="radio" name="finish_id" value="3" data-message='another thing' onchange="javasript:$('#finish_name').text(finish[$(this).val()])"> 
<span id="finish_name"></span>

http://jsfiddle.net/erPQA/3/

来源

2013-02-26 18:30:11 gbtimmon

jQuery：使用.text（）显示数组值

回答

相关问题