本文主要是介绍require.js 模态框上利用defind加载js，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
页面：
<div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button><h4 class="modal-title">添加新用户</h4></div><div class="modal-body">
<form id="user-create-modalform" class="form-horizontal" method="post" action="/crud/add"><div class="row form-group"><div class="col-md-2 control-label"><label for="title">Title</label></div><div class="col-md-7 controls"><input type="text" id="title" name="title" class="form-control" ></div></div><div class="row form-group"><div class="col-md-2 control-label"><label for="email2">邮箱地址</label></div><div class="col-md-7 controls"><input type="text" id="email" data-url="/secure/crud/add/check_email" name="email" class="form-control" ></div></div><div class="row form-group"><div class="col-md-2 control-label"><label for="nickname2">用户名</label></div><div class="col-md-7 controls"><input type="text" id="nickname" name="nickname" data-url="/secure/crud/add/check_nickname" class="form-control" ></div></div><div class="row form-group"><div class="col-md-2 control-label"><label for="password">密码</label></div><div class="col-md-7 controls"><input type="password" id="password" name="password" class="form-control"><p class="help-block">5-20位英文、数字、符号，区分大小写</p></div></div><div class="row form-group"><div class="col-md-2 control-label"><label for="confirmPassword">确认密码</label></div><div class="col-md-7 controls"><input type="password" id="confirmPassword" name="confirmPassword" class="form-control"><p class="help-block">再输入一次密码</p></div></div><button type="submit" class="btn btn-primary pull-right" data-toggle="form-submit" data-target="#user-create-modalform">提交</button></form>
</div></div>
</div><script>
require(['controller/secure/crud/modalform2'], function(m){alert("require");m.validateForm();
});
</script>
自定义的js (modalform2.js)
define(["jquery", "bootstrap-notify", "jquery-validation"], function($, notify, validation){var myfun = function() {alert("myfun");}return {initForm : function() {alert("initForm");},validateForm: function() {jQuery.validator.setDefaults({errorElement : 'p',errorClass : 'help-block',highlight : function(element) {$(element).closest('.form-group').addClass('has-error');},success : function(label) {label.closest('.form-group').removeClass('has-error');label.remove();},errorPlacement : function(error, element) {element.parent('div').append(error);}});$("#user-create-modalform").validate({ignore: [],rules : {title : {required : true,maxlength : 60},email : {required : true,email : true,remote : '/crud/add/check_email'}},messages : {title : {required : '标题不能为空',maxlength : '标题的最大长度不能超过60个字符'},email : {remote : 'Email已存在，balabala'}},submitHandler : function(form) {//form.submit();$.post($(form).attr('action'), $(form).serialize(), function(json) {if(json.status == "success") {Notify.success("<i class='glyphicon glyphicon-saved'></i> 账号信息设置成功。", 3);$("#modal").modal('hide');} else if(json.status == "fail") {Notify.danger("fail", 3);} else {Notify.danger("<i class='glyphicon glyphicon-warning-sign'></i> " + json.message, 6);}}, 'json').fail(function() {Notify.danger("设置失败，请检查网络", 3);});return false;}}); }};
});
这篇关于require.js 模态框上利用defind加载js的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
