jQuery中如何在层级结构中选择带有部分匹配id的输入文本框

你原有写法的问题在于全局查询#programme_details下的第一个输入框，查询范围和id匹配规则都不符合需求，修正后的实现代码如下：

$("th[id*='programme_details']").each(function() {
    // 用text()获取纯文本避免标签干扰，trim去除首尾空格减少匹配误差
    var programeName = $(this).text().trim();    
    if(programeName.indexOf('Donor') > -1){
        // 从当前匹配到Donor的表头出发，向上找最近的行元素，限定查询范围在当前程序对应的行内
        // *若程序名和输入框的公共父容器不是tr，可调整`closest`内的选择器为实际的父元素选择器*
        const $targetInput = $(this).closest('tr').find('input[id*="clinic_base_fee_fresh"]');
        // 确认找到目标输入框再执行赋值，避免控制台报错
        if($targetInput.length) {
            $targetInput.val(12);
        }                    
        console.log(programeName);
    }                    
});

核心调整说明：

• 匹配程序名改用text()而非html()，避免表头内嵌套标签、样式属性干扰字符串匹配
• 用$(this).closest('父元素选择器')将输入框的查询范围限定在当前Donor程序对应的DOM区块内，不会匹配到其他程序的输入框
• 直接使用jQuery的[attribute*=value]属性包含选择器，一次性匹配id包含clinic_base_fee_fresh的输入框，无需单独判断id属性

如果你的页面DOM结构中程序名和目标输入框不在同一行，只需要调整closest()内的选择器为两者共同的父元素选择器即可正常匹配。

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