當我在選擇框中調用.options時，爲什麼會出現「未定義」？

我正在嘗試遵循本教程（http://railscasts.com/episodes/88-dynamic-select-menus）獲取使用RoR的動態選擇框。無需擔心RoR位，這是一個Javascript特定的問題。當我在選擇框中調用.options時，爲什麼會出現「未定義」？

每次運行此函數時，都會出現「選項」未定義的錯誤。我試着在控制檯中手動運行命令，但無論如何，它都會吐出未定義的命令。我有它的確切類型，因爲我看到它的教程，但不知何故，它不工作對我來說...

這裏是有問題的javascript：

function clientSelected() { 
var client_id = $('#piece_client_id').val(); 
// THIS IS THE PROBLEM LINE 
var options = $('piece_campaign_id').options; 
options.length = 0; 
campaigns.each(function(campaign) { 
    if (campaign[0] == client_id) { 
     options[options.length] = new Option(campaign[1], campaign[2]); 
    } 
}); 
if (options.length == 1) { 
    $('campaign_field').hide(); 
} else { 
    $('campaign_field').show(); 
} 
}

這裏是它的努力工作，在HTML ：

<select id="piece_campaign_id" name="piece[campaign_id]"><option value=""></option> 
<option value="1">Feed The Dogs</option> 
<option value="2">Watch Television</option> 
<option value="3">End The Suffering</option> 
<option value="4">Brian Bilbrey</option> 
<option value="5">SummerHill Homes/Yes on A&amp;B</option> 
</select>

感謝一堆看看！讓我知道是否還有其他事情可以添加，以使我的問題更加清晰。

來源

2011-09-09 counterbeing

你'。each（）'循環也不起作用。我不知道'campaign'是什麼，但'campaign'參數將指向一個索引號，所以'campaign [0]'將永遠是'undefined'。 – user113716

...它看起來像你所遵循的教程不使用'jQuery'。我猜可能是'prototypejs'。 – user113716

嘗試：

var options = $('#piece_campaign_id').get(0).options;

或

var options = $('#piece_campaign_id')[0].options;

當你使用的是jQuery對象，它不具有options財產。另外，請確保包含id選擇器（#）。

來源

2011-09-09 20:42:57

$（'＃piece_campaign_id'）[0] .options'做同樣的事情，稍微短一些。 – Blazemonger

@ mblase75我忘記了數組的語法，我將它編輯進去。 –

不錯！那是魔術醬。我已經嘗試了id選擇器沒有運氣，所以我已經恢復。但get（0）做到了！我將不得不閱讀：D謝謝！ – counterbeing

$('piece_campaign_id')

必須

$('#piece_campaign_id')

來源

2011-09-09 20:42:33

以下代碼不準確。

var options = $('piece_campaign_id').options;

應該

var options = $('#piece_campaign_id')[0].options;

你會發現兩個變化。

在選擇
通過添加[0]的jQuery對象之後通過添加#的。

在jQuery中你所需要的idvalue（這類似於CSS之前追加＃的ID選擇一個元素。下面是一些參考http://api.jquery.com/id-selector/

下一個問題是你試圖訪問屬性這並不一個jQuery對象上存在。options是一個HTML DOM屬性。正因爲如此，你必須從jQuery對象內訪問DOM對象。

var options = $('#piece_campaign_id') //Returns jQuery Object 

var options = $('#piece_campaign_id')[0] //Returns HTML DOM Object 
//The line above will return the same as 
var options = document.getElementById('piece_campaign_id')

注意

在你的代碼下面的選擇器是最有可能不準確

$('campaign_field').hide(); 
    ... 
    $('campaign_field').show();

來源

2011-09-09 20:57:19

當我在選擇框中調用.options時，爲什麼會出現「未定義」？

回答

相關問題