Question

我已经编写了这个代码，用于在提交下拉菜单时获取数据，它正在处理提交按钮单击，但现在我希望这只能在下拉菜单中更改值，这是我的工作代码。< / p>

<script language="javascript">
    function validFormDataCity() {
        if (document.getElementById("jobsbycitymenu").value == "Not Selected") {
            alert("Please select a City.");
            document.citysearch.jobsbycitymenu.focus();
            return false;
        }
    }
</script>   

<div id='jobsbycity'>
    <form id="citysearch" name="citysearch" method="POST" action="jobs-by-city-results">
        <p id='jobsbycitytitle'>Jobs by City</p>
        <select name="city" id='jobsbycitymenu'>
            <option value="Not Selected">---Select City---</option>
            <option value='Abbottabad'>Abbottabad</option>
            <option value='Arifwala'>Arifwala</option>
            <option value='Attock'>Attock</option>
            <option value='Badin'>Badin</option>
        </select>
        <input type="submit" name="Submit" value=" Go " id='jobsbycitymenubtn' onclick="return validFormDataCity();"/>
    </form>
</div>

非常感谢你的帮助

Answer 1

由于您要标记jQuery，您可以使用：

$('#jobsbycitymenu').on('change', function(){
   $(this).closest('form').submit(); 
});

所以你的整个代码（请删除内联脚本）将是：

$(function () {
    $('#jobsbycitymenu').on('change', function () {
        if (validFormDataCity()) $(this).closest('form').submit();
    });
    $('#citysearch').submit(function (e) {
        e.preventDefault;
        return validFormDataCity();
    });

    function validFormDataCity() {
        if (document.getElementById("jobsbycitymenu").value == "Not Selected") {
            alert("Please select a City.");
            document.citysearch.jobsbycitymenu.focus();
            return false;
        }
        return true
    }
});

Demo

对于普通Javascript，您可以使用this。

我想验证价值变化的下拉菜单而不是提交按钮点击

1 个答案:

Demo