jQuery如何获取td内表单元素类型（支持text/date/number/select）

核心实现思路 #

• 首先修正选择器范围：原来的选择器仅匹配<input>元素，自然无法获取<select>，调整为匹配td下所有可能的表单元素input, select
• 分层判断类型：先通过标签名区分是select还是input，再针对input取type属性判断具体控件类型
• 可以用jQuery内置的.is()方法做更语义化的判断，无需处理undefined场景

优化后代码示例 #

function Test(valCd) {
    // 注意：动态表格中id不能重复，建议把td的id="refValue"改为class="refValue"，这里暂时按原写法兼容
    const $formEl = $('tr[valCd=' + valCd + ']').find('td#refValue').find('input, select').first();
    let type;

    // 先判断是不是select
    if ($formEl.is('select')) {
        type = 'select';
        // 此处写select的赋值逻辑
    } else {
        // 是input元素，直接取type
        type = $formEl.attr('type');
        switch(type) {
            case 'text':
            case 'number':
                // 此处写text/number的赋值逻辑
                break;
            case 'date':
                // 此处写date的赋值逻辑
                break;
            // 其他input类型可以在这里扩展
        }
    }
}

额外优化建议 #

• 动态生成的表格不要重复使用相同id，否则td[id=refValue]只会匹配到第一个符合条件的元素，建议替换为class="refValue"，选择器改为td.refValue
• 如果需要统一返回类型字符串做后续逻辑判断，可以封装一个单独的获取表单类型的工具函数，复用性更高：

function getFormElType($el) {
    if ($el.is('select')) return 'select';
    if ($el.is('input')) return $el.attr('type');
    return 'unknown';
}

// 调用示例
const type = getFormElType($formEl);

内容的提问来源于stack exchange，提问作者Sandro