Question

我有一个PHP表单，其中有一个用于就业状态的下拉菜单，其中包含“就业”，“自雇人员”和“失业”选项。

如果有人在尝试提交表单时选择失业，我想显示验证消息。

我的代码在

下面

var employment = $("#employment").val().length; 

if( employment == 0 )
{
    $("#employment").parent().css('background-color', '#B2E120');
    error = true;
}
else{
    $("#employment").parent().css('background-color', '#fff');
}

我的下拉代码如下。

<option value="unemployed" title="Your tooltip here">Unemployed</option>

Answer 1

让我们假设您的标记更加彻底：

<select name="employment">
  <option value="unemployed" title="Unemployed title">Unemployed</option>
  <option value="selfemployed" title="Self-Employed title">Self-Employed</option>
  <option value="employed" title="Employed title">Employed</option>
</select>

然后，您可以将change事件绑定到select元素，并执行有条件地添加背景颜色的函数：

<script>
// Wait until jQuery has loaded
$(function(){
  // Bind change event
  $('[name="employment"]').change(function(){
    var val = $('[name="employment"] :selected').val();
    if(val == 'unemployed') {
      $('[name="employment"]').css('background-color', '#b2e120');
    } else {
      $('[name="employment"]').css('background-color', '#fff');
    }
  });
});
</script>

您可以在此处查看此操作：http://jsfiddle.net/yMPHV/1/

请注意，这仅在选择更改时触发。因此，如果您希望在页面加载时执行相同的代码，请在绑定到change事件后添加此代码：

$('[name="employment"]').change();

这将触发select元素的change事件，从而执行相同的逻辑。

特定选择选项的PHP表单验证和工具提示消息

1 个答案: