使用Jquery調用JavaScript創建的標記內的JavaScript函數

我有單擊按鈕時使用Jquery顯示的表單字段。使用Jquery調用JavaScript創建的標記內的JavaScript函數

[select dropdown: conOperator] [textfield: conValue ] [select dropdown: conValuedd]

conValuedd默認爲隱藏。

我試圖弄清楚一種方式，以便當我在第一個選擇下拉菜單[conOperator]中選擇蘋果或香蕉時，它將隱藏文本字段conValue，並顯示下拉conValuedd。但是，如果我選擇西瓜，它會顯示conValue並隱藏convueduedd再次。任何想法將不勝感激。

$('<select id="conOperator' + num + '" name="conOperator' + num + '" class="standard_select" style="width:147px;"> 
    <option>Watermelon</option> 
    <option>Apple</option> 
    <option>Banana</option> 
    </select>&nbsp; 
    <input type="text" id="conValue' + num + '" name="conValue' + num + '" class="short_input" value="" style="width:147px;">&nbsp;&nbsp; 
    <select style="display:none" id="conValuedd' + num +'" multiple="multiple" size="5"> 
    <option value="option1">Blah</option> 
    <option value="option2">Blah</option> 
    </select>').appendTo('#addCondition');

來源

2012-07-03 user1038814

_altogether現在..._ **你嘗試過什麼** – Alnitak

完全無關，這是一個不好的做法多少有些使用？代碼中的硬編碼字符串值，您可能需要考慮使用像hogan.js這樣的模板庫來生成該標記。除非當然這純粹是爲了測試的目的，在這種情況下，這樣做的開銷可能不值得獲得靈活性。 –

你的jQuery代碼看起來像你做錯了。 @Radu是正確的 - 模板引擎可能是正確的，或者你可以簡單地使用jQuery的'.clone（）'來複制一個現存的HTML結構。從巨大的JavaScript字符串構建HTML是不太理想的。 – Tomalak

當你調用appendTo()，生成<select/>被添加到DOM，所以你可以使用jQuery檢索並在其上添加偵聽器。

$("#conOperator" + num).change(function() { 
    // Your logic here 
}

來源

2012-07-03 12:17:09 Florent

嘗試一些像：

$('#addCondition').on('change','#conOperator' + num, function(e){   
    switch($('option:checked',this).text()){ 
     case 'Apple': 
     case 'Banana': 
      $(this).nextAll(':text:first').hide(); 
      $(this).nextAll('select:first').show(); 
      break; 
     case 'Watermelon': 
      $(this).nextAll(':text:first').show(); 
      $(this).nextAll('select:first').hide(); 
      break; 
    } 
}); 
$('#conOperator' + num).trigger('change');

DEMO

來源

2012-07-03 12:21:06 Engineer

使用Jquery調用JavaScript創建的標記內的JavaScript函數

回答

相關問題