jQuery -确定输入元素是textbox还是select list

3ks5zfa0  于 2023-08-04  发布在  jQuery
关注(0)|答案(4)|浏览(135)

如何判断jQuery中的:input过滤器返回的元素是文本框还是选择列表?
我想有一个不同的行为为每一个(textbox返回文本值,选择返回键和文本)
示例设置:

<div id="InputBody">
<div class="box">
    <span id="StartDate">
        <input type="text" id="control1">
    </span>
    <span id="Result">
        <input type="text" id="control2">
    </span>
    <span id="SelectList">
        <select>
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
        </select>
    </span>
</div>
<div class="box">
    <span id="StartDate">
        <input type="text" id="control1">
    </span>
    <span id="Result">
        <input type="text" id="control2">
    </span>
    <span id="SelectList">
        <select>
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
        </select>
    </span>
</div>

字符串
然后是脚本:

$('#InputBody')
    // find all div containers with class = "box"
    .find('.box')
    .each(function () {
        console.log("child: " + this.id);

        // find all spans within the div who have an id attribute set (represents controls we want to capture)
        $(this).find('span[id]')
        .each(function () {
            console.log("span: " + this.id);

            var ctrl = $(this).find(':input:visible:first');

            console.log(this.id + " = " + ctrl.val());
            console.log(this.id + " SelectedText = " + ctrl.find(':selected').text());

        });

t5zmwmid

t5zmwmid1#

你可以这样做:

if( ctrl[0].nodeName.toLowerCase() === 'input' ) {
    // it was an input
}

字符串
或者是这个,它更慢,但更短,更干净:

if( ctrl.is('input') ) {
    // it was an input
}


如果你想更具体,你可以测试类型:

if( ctrl.is('input:text') ) {
    // it was an input
}

4szc88ey

4szc88ey2#

也可以使用.prop检索DOM属性
下面是选择框示例代码

if( ctrl.prop('type') == 'select-one' ) { // for single select }

if( ctrl.prop('type') == 'select-multiple' ) { // for multi select }

字符串
用于文本框

if( ctrl.prop('type') == 'text' ) { // for text box }

mfuanj7w

mfuanj7w3#

如果你只是想检查类型,你可以使用jQuery的.is()函数,
就像我在下面使用的情况一样,

if($("#id").is("select")) {
 alert('Select'); 
else if($("#id").is("input")) {
 alert("input");
}

字符串

huus2vyu

huus2vyu4#

您可以使用以下代码确定表单元素是输入还是选择:

$('ElementSelector').prop('tagName').toLowerCase();

字符串

相关问题