呼叫从选择元件在HTML

function Myfunc(obj1) 
 
{ 
 
    alert(obj1.prop('outerHTML')); 
 
}

<select id="myselect" onchange="MyFunc(jQuery(this))"> 
 
        <option value="v1">Value 1</option> 
 
        <option value="v2">Value 2</option> 
 
        <option value="v3" selected="selected">Value 3</option> 
 
</select>

JavaScript函数我具备上述两个片段。当我提醒对象我得到完整的<选择&tg;标记及其所有选项。

但是，我想要的是传递的对象应该只是我选择的选项而不是完整的选择元素块。

来源

2014-09-30 Prashant

是我想要的选项的完整的HTML选择，我非常感谢@Regent的答案。 – Prashant 2014-11-06 08:44:17

而不是过时的onchange你可以使用jQuery $('selector').change(function() { });

Fiddle

简体HTML：

<select id="myselect"> 
    <option value="v1">Value 1</option> 
    <option value="v2">Value 2</option> 
    <option value="v3" selected="selected">Value 3</option> 
</select>

JS：

$(document).ready(function() 
{ 
    $('#myselect').change(function() 
    { 
     alert($(this).find(':selected').text()); 
    }); 
});

更新。如果您需要选择<option>外部HTML，则它可以是：

Fiddle。

$(document).ready(function() 
{ 
    $('#myselect').change(function() 
    { 
     alert($(this).find(':selected')[0].outerHTML); 
    }); 
});

来源

2014-09-30 09:33:31 Regent

+1建议使用不显眼的事件处理程序，但-1不能读取问题。这是他想要的选项元素，而不是文本。 – anddoutoi 2014-09-30 09:39:03

@anddoutoi您确定''是否被请求，不仅是其文本值？我其实读过问题。 – Regent 2014-09-30 09:42:49

“但是，我想要的是通过的对象应该只是我选择的选项” – anddoutoi 2014-09-30 09:47:04

尝试：

onchange="MyFunc(jQuery(this).find('option:selected'))“

来源

2014-09-30 09:30:44 jevgenig

你为什么推荐内嵌JavaScript？分开你的顾虑，并把它们放在一个单独的JS文件中。 – Undefined 2014-09-30 09:36:29

刚回答问题。但绝对同意f.e.摄政公司的解决方案作为处理事件的更好方法。 – jevgenig 2014-09-30 09:37:56

@jevgenig是的，我同意，它是“按原样”，顺便说一句，这个答案是投票。但是，显示OP适当的方式来处理事件是很好的。这是提到的想法。 – Regent 2014-09-30 09:40:24

您可以使用:selected选择如下：

$(document).ready(function() { 
    $('#myselect').on('change', function() { 
     alert($(this).find('option:selected').eq(0)); 
    }); 
});

来源

2014-09-30 09:34:31 patrykf

OP想要选项元素。不是价值。在提交答案之前阅读Q. – anddoutoi 2014-09-30 09:35:30

@anddoutoi编辑 – patrykf 2014-09-30 09:38:02

@SwaghettiYolonese为什么'.eq（0）'？ – 2014-09-30 09:41:55

用作

function MyFunc(obj1) 
{ 
    alert($("#myselect option:selected").text()); 
}

DEMO

，或者您可以使用

function MyFunc(obj1) 
{ 
    alert($("#myselect option:selected").html()); 
}

DEMO

来源

2014-09-30 09:36:30 Amit

您可以传递对象或者您可以在函数中获取选定的选项。

若要选择的选项中的HTML代码如下功能使用 -

注意 - 请更正功能拼写无论是在onchange或函数声明。

function MyFunc(obj1) 
 
{ 
 
    var value = obj1.value; 
 
    var optionHTML = $(obj1).find('option[value="'+value+'"]'); 
 
    
 
    alert($('<div>').append(optionHTML.clone()).html()); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<select id="myselect" onchange="MyFunc(this)"> 
 
     <option value="v1">Value 1</option> 
 
     <option value="v2">Value 2</option> 
 
     <option value="v3" selected="selected">Value 3</option> 
 
</select>

另一种方法是使用jQuery绑定change事件处理程序，并获得选择HTML

$('#myselect').change(function(){ 
 
    var value = $(this).val(); 
 
    var option = $(this).find('option[value="'+value+'"]'); 
 
    var optionHTML = $('<div>').append(option.clone()).html(); 
 
    alert(optionHTML); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"> 
 
    </script> 
 
<select id="myselect"> 
 
    <option value="v1">Value 1</option> 
 
    <option value="v2">Value 2</option> 
 
    <option value="v3" selected="selected">Value 3</option> 
 
</select>

来源

2014-09-30 09:37:40

呼叫从选择元件在HTML

回答

相关问题