gpt4 book ai didi

javascript - 使用 jquery 为动态创建的下拉设置设置 onchange 事件

转载 作者:行者123 更新时间:2023-11-30 17:09:37 26 4
gpt4 key购买 nike

我正在创建两个这样的下拉菜单

var drp_nt = $('<select />', {
'id' : 'drp_' + nt,
'name' : 'drp_' + nt+'[]',
'onchange' : check_data(),
'multiple': true});

var drp_cnt = $('<select />', {
'id' : 'drp_' + cnt,
'name' : 'drp_' + cnt+'[]',
'onchange' : check_data(),
'multiple': true});

现在我像这样定义 check_data_function

function check_data()
{
if($("select option:selected").length==2)
alert('Two Dropdown Selected');
else
alert($("select option:selected").length);
}

但问题是,check_data() 函数没有被调用。

我怎样才能做到这一点..???

这是我的 HTML

<div id="cont_drp_nt" class="drp_container">
<img id="drp_nt_loader" class="loader_img" src="images/ajax-loader-1.gif" style="display: none;">
<select id="drp_nt" name="drp_nt[]" multiple="multiple" style="display: none;">
<option value="http://api.hasoffers.com/v3/Affiliate_Offer.json">http://api.hasoffers.com/v3/Affiliate_Offer.json</option>
</select>
<div class="btn-group">
<button class="multiselect dropdown-toggle btn btn-default" data-toggle="dropdown" type="button" title="http://api.hasoffers.com/v3/Affiliate_Offer.json">
<ul class="multiselect-container dropdown-menu" style="max-height: 200px; overflow-y: auto; overflow-x: hidden;">
</div>
</div>

完整脚本

function get_data(v)
{
var cnt = 'cnt';
var ctg = 'ctg';
var api = 'api';
var nt = 'nt';
$('#drp_'+cnt).remove();
$('#drp_'+ctg).remove();
$('#drp_'+api).remove();
$('#drp_'+nt).remove();
$('.btn-group').remove();



$('#drp_'+cnt+"_loader").show();
$('#drp_'+ctg+"_loader").show();
$('#drp_'+api+"_loader").show();
$('#drp_'+nt+"_loader").show();

$.post("ajax.php",{'version':v,'func':'get_nt'},
function(data)
{
$('#drp_'+nt+"_loader").hide();
var drp_nt = $('<select />', {
'id' : 'drp_' + nt,
'name' : 'drp_' + nt+'[]',
'change' : check_data(),
'multiple': true});
for(i=0;i<data.length;i++)
{
content ="<option value="+data[i].network+">"+data[i].network+"</option>";
$(drp_nt).append(content);
}
$('#cont_drp_'+nt).append(drp_nt);
$(drp_nt).multiselect({
includeSelectAllOption: true,
enableFiltering: true,
maxHeight: 200,
allSelectedText: 'No option left ...'
});
}, "json");

$.post("ajax.php",{'version':v,'func':'get_api'},
function(data)
{
$('#drp_'+api+"_loader").hide();
var drp_api = $('<select />', {
'id' : 'drp_' + api,
'name' : 'drp_' + api+'[]',
'multiple': true});
for(i=0;i<data.length;i++)
{
content ="<option value="+data[i].api+">"+data[i].api+"</option>";
$(drp_api).append(content);
}
$('#cont_drp_'+api).append(drp_api);
$(drp_api).multiselect({
includeSelectAllOption: true,
enableFiltering: true,
maxHeight: 200,
allSelectedText: 'No option left ...'
});
}, "json");



$.post("ajax.php",{'version':v,'func':'get_category'},
function(data)
{
$('#drp_'+ctg+"_loader").hide();
var drp_ctg = $('<select />', {
'id' : 'drp_' + ctg,
'name' : 'drp_' + ctg+'[]',
'multiple': true});
for(i=0;i<data.length;i++)
{
content ="<option value="+data[i].category+">"+data[i].category+"</option>";
$(drp_ctg).append(content);
}
$('#cont_drp_'+ctg).append(drp_ctg);
$(drp_ctg).multiselect({
includeSelectAllOption: true,
enableFiltering: true,
maxHeight: 200,
allSelectedText: 'No option left ...'
});
}, "json");



$.post("ajax.php",{'version':v,'func':'get_country'},
function(data)
{
$('#drp_'+cnt+"_loader").hide();
var drp_cnt = $('<select />', {
'id' : 'drp_' + cnt,
'name' : 'drp_' + cnt+'[]',
'multiple': true});
for(i=0;i<data.length;i++)
{
content ="<option value="+data[i].country+">"+data[i].country+"</option>";
$(drp_cnt).append(content);
}
$('#cont_drp_'+cnt).append(drp_cnt);
$(drp_cnt).multiselect({
includeSelectAllOption: true,
enableFiltering: true,
maxHeight: 200,
allSelectedText: 'No option left ...'
});
}, "json");
}

最佳答案

终于找到了!您必须像这样使用 on: {...}:

var drp_nt = $('<select />', {
'id': 'drp_' + nt,
'name': 'drp_' + nt + '[]',
on: {
change: check_data
},
'multiple': true
});

var drp_cnt = $('<select />', {
'id': 'drp_' + cnt,
'name': 'drp_' + cnt + '[]',
on: {
change: check_data
},
'multiple': true
});

JQuery documentation

关于javascript - 使用 jquery 为动态创建的下拉设置设置 onchange 事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27291230/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com