如何通过JavaScript/jQuery基于Zendesk多选字段控制表单字段显隐

你的代码存在语法错误，同时jQuery的使用逻辑也有问题，以下是修正后的实现方案：

问题分析 #

你要实现根据多选字段的选中选项来显示或隐藏指定表单字段，Zendesk原生确实无此功能，需通过自定义JS/jQuery实现。原始代码的问题包括：

• if语句缺少闭合括号，语法不完整
• 错误使用contains写法，jQuery中无此直接用法
• 未监听多选字段的变化事件，仅执行一次无法响应选项变更

修正后的代码 #

// 监听多选字段的选项变更事件
$('.request_custom_fields_19829743171597').on('change', function() {
    // 判断目标选项是否被选中
    const hasTargetOption = $(this).find('option:selected[value="incorrect_party_invite"]').length > 0;
    // 根据选中状态切换字段显隐
    hasTargetOption ? $('.request_custom_fields_87493112478139').hide() : $('.request_custom_fields_87493112478139').show();
});

// 页面加载时触发一次事件，确保初始状态正确
$('.request_custom_fields_19829743171597').trigger('change');

代码说明 #

• 绑定change事件监听多选字段的选项变化
• 通过option:selected[value="incorrect_party_invite"]精准判断目标选项是否被选中
• 页面加载时主动触发事件，避免初始状态不符合预期
• 请确保代码中的字段类名（request_custom_fields_xxxx）与实际场景一致

原始问题代码（供参考） #

if( $('.request_custom_fields_19829743171597' contains 'incorrect_party_invite')
$('.request_custom_fields_87493112478139').hide(); 
}

原始问题截图：

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