使用jQuery中动态创建的select的select值获取div html

时间:2018-08-09 15:36:51

标签: javascript jquery html select

我在jQuery中使用选择选项动态创建了一个div。这是一个示例。

<div id="myDiv">
    <select id="mySelect">
        <option selected value="0">A</option>
        <option value="1">B</option>
        <option value="2">C</option>
        <option value="3">D</option>
    </select>
</div>

0是默认选择的值。

当我获得像$("#myDiv").html()这样的div的html时,它将得到以下内容。

<div id="myDiv">
    <select id="mySelect">
        <option selected value="0">A</option>
        <option value="1">B</option>
        <option value="2">C</option>
        <option value="3">D</option>
    </select>
</div>

与上面的正常代码相同。

但是,当我将所选值更改为2时,$("#myDiv").html()仍在获得相同的代码。仍然是0。

如何获取具有动态更改值的div的html?

3 个答案:

答案 0 :(得分:0)

您可以这样做:

$('#yourSelect option:selected').val()

答案 1 :(得分:0)

 $('#myDiv').find("#mySelect").change(function () {
                alert($("#mySelect option:selected").text());
                alert($("#mySelect option:selected").val());
            });
  

在此处输入代码

答案 2 :(得分:0)

也许是这样的:

<Link>
function create_select(){
   	var select=$('<select/>').attr('id','mySelect');
   	var option0=$('<option/>').val(0).text('A').attr('selected', true);
   	   select.append(option0);
   	var option1=$('<option/>').val(1).text('B');
   	  select.append(option1);
   	var option2=$('<option/>').val(2).text('C');
   	  select.append(option2);
   	var option3=$('<option/>').val(3).text('D');
   	  select.append(option3);
   	$('#myDiv').empty().append(select);
}


function change_select_value(_new_val){
	$('#mySelect option').removeAttr('selected');
	$('#mySelect').val(_new_val).change();
}


$(document).on('change', '#mySelect', function(){    //conctruction for Dynamically created element
        alert('change value to =>'+this.value);  //or  $(this).val();
});