如何使用jQuery创建自定义表单验证?

普拉桑斯

这是我为验证表单而创建的代码。

$(function () {
    $('#subbtn').click(function () {
        if ($('#course').val('x')) {
            $('#s1').show();
        }
        if ($('#sem').val('x')) {
            $('#s2').show();
        }
    });

的HTML

<button id="subbtn" type="submit>Submit</button
<span id="$s1" style="display:none;">*</span>
<span id="$s2" style="display:none;">*</span>

#course并且#sem是列表框的ID。
将两者都保留为空白并按下按钮后,它可以正常工作(将同时显示星号),但是在选择第一个列表框并将第二个列表框保留为空之后,然后按一下按钮,便得到相同的结果(即,显示两个星号而不是一)请帮忙,谢谢

蝴蝶

请尝试这个

$(function () {
    $(document).on('click', '#subbtn', function () {
        if ($('#course').val() == '') {
            $('#s1').show();
        } else {
            $('#s1').hide();
		}
        if ($('#sem').val() == '') {
            $('#s2').show();
        } else {
            $('#s2').hide();
		}
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="course">
	<option value=""></option>
	<option value="be">B.E</option>
	<option value="mba">MBA</option>
	<option value="arts">Arts</option>
	<option value="finance">Finance</option>
</select>
<select id="sem">
	<option value=""></option>
	<option value="1">1St</option>
	<option value="2">2nd</option>
	<option value="3">3rd</option>
	<option value="4">4th</option>
</select>
<button id="subbtn" type="submit">Submit</button>
<span id="s1" style="display:none;">*</span>
<span id="s2" style="display:none;">*</span>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何使用jQuery创建自定义的表单验证?

来自分类Dev

如何使用Flexbox创建自定义表单?

来自分类Dev

如何使用 Stripe 创建自定义表单

来自分类Dev

Angular2模板驱动的表单:如何为自定义表单控件创建字段验证?

来自分类Dev

在创建表单之前运行自定义验证

来自分类Dev

如何在cakephp3中为无模型表单创建自定义验证

来自分类Dev

在Laravel 5中使用表单请求验证时如何添加自定义验证规则

来自分类Dev

Yii2-表单验证规则:如何使用自定义验证功能或替代方法?

来自分类Dev

jQuery表单URL验证自定义消息

来自分类Dev

如何应用自定义表单验证[Angular]

来自分类Dev

如何使HTML表单验证自定义HtmlInputElement?

来自分类Dev

symfony 2创建自定义表单如何获取表单自定义元素?

来自分类Dev

自定义表单 使用现场清洁/验证提交

来自分类Dev

使用jQuery验证来验证自定义方法

来自分类Dev

如何在Moodle中创建自定义表单?

来自分类Dev

如何保存Acumatica创建的自定义表单

来自分类Dev

如何在Joomla中创建自定义联系表单?

来自分类Dev

如何在wordpress上创建自定义联系表单?

来自分类Dev

如何在表单标题中创建自定义视图

来自分类Dev

如何为表单创建自定义的“as_table()”方法?

来自分类Dev

如何解决使用大量自定义组件创建复杂表单的问题?

来自分类Dev

如何自定义使用simple_form gem创建的设计登录和注册表单?

来自分类Dev

Prestashop 1.6:如何使用管理控制器创建和提交自定义表单

来自分类Dev

如何创建 ruby on rails 自定义多步表单而不是使用 gem

来自分类Dev

在Java中使用注释创建自定义表单

来自分类Dev

使用React创建自定义的Stripe表单

来自分类Dev

使用Devise User创建自定义编辑用户表单

来自分类Dev

用于表单验证的自定义指令

来自分类Dev

JavaScript自定义表单验证

Related 相关文章

  1. 1

    如何使用jQuery创建自定义的表单验证?

  2. 2

    如何使用Flexbox创建自定义表单?

  3. 3

    如何使用 Stripe 创建自定义表单

  4. 4

    Angular2模板驱动的表单:如何为自定义表单控件创建字段验证?

  5. 5

    在创建表单之前运行自定义验证

  6. 6

    如何在cakephp3中为无模型表单创建自定义验证

  7. 7

    在Laravel 5中使用表单请求验证时如何添加自定义验证规则

  8. 8

    Yii2-表单验证规则:如何使用自定义验证功能或替代方法?

  9. 9

    jQuery表单URL验证自定义消息

  10. 10

    如何应用自定义表单验证[Angular]

  11. 11

    如何使HTML表单验证自定义HtmlInputElement?

  12. 12

    symfony 2创建自定义表单如何获取表单自定义元素?

  13. 13

    自定义表单 使用现场清洁/验证提交

  14. 14

    使用jQuery验证来验证自定义方法

  15. 15

    如何在Moodle中创建自定义表单?

  16. 16

    如何保存Acumatica创建的自定义表单

  17. 17

    如何在Joomla中创建自定义联系表单?

  18. 18

    如何在wordpress上创建自定义联系表单?

  19. 19

    如何在表单标题中创建自定义视图

  20. 20

    如何为表单创建自定义的“as_table()”方法?

  21. 21

    如何解决使用大量自定义组件创建复杂表单的问题?

  22. 22

    如何自定义使用simple_form gem创建的设计登录和注册表单?

  23. 23

    Prestashop 1.6:如何使用管理控制器创建和提交自定义表单

  24. 24

    如何创建 ruby on rails 自定义多步表单而不是使用 gem

  25. 25

    在Java中使用注释创建自定义表单

  26. 26

    使用React创建自定义的Stripe表单

  27. 27

    使用Devise User创建自定义编辑用户表单

  28. 28

    用于表单验证的自定义指令

  29. 29

    JavaScript自定义表单验证

热门标签

归档