首页 > 代码库 > javascript表单行为效果展示
javascript表单行为效果展示
效果如下
以上效果是在点击下一步的时候触发的效果显示
代码如下
////加工厂
$(function() {
$("#planttwo").click(function () {
var memberId = $.cookie(‘Himall-User‘);
if (memberId) {
var l = [getCount(),
getJg(),
getFalse(‘input[name="type0"]‘, ‘span.ed0‘),
getFalse(‘input[name="type1"]‘, ‘span.ed1‘),
getFalse(‘input[name="type3"]‘, ‘span.ed3‘),
getFalse(‘input[name="type5"]‘, ‘span.ed5‘)];
if (getJg() && getCount() && getFalse(‘input[name="type0"]‘, ‘span.ed0‘) && getFalse(‘input[name="type1"]‘, ‘span.ed1‘) && getFalse(‘input[name="type3"]‘, ‘span.ed3‘) && getFalse(‘input[name="type5"]‘, ‘span.ed5‘)) {
var categoryId = $("#CategoryIds").val();
var categoryName = $("#CategoryName").val();
var fabric = $("#FabricCategory").val();
var minPrice = $("#MinPrice").val();
var maxPrice = $("#MaxPrice").val();
var processTypes = $("#ProcessTypes").val();
var processTypeInt = 1;
if (processTypes == "清加工") {
processTypeInt = 2;
}
var quantity = $("#Quantity").val();
var deliveryDate = $("#years").val();
var IsUrgent = 0;
if ($("#IsUrgent").is(‘:checked‘)) {
IsUrgent = 1;
}
location.href = "http://www.mamicode.com/Home/PlantTwo?categoryId=" + categoryId + "&categoryName=" + categoryName + "&fabric=" + fabric + "&minPrice=" + minPrice + "&maxPrice=" + maxPrice + "&processTypes=" + processTypes + "&quantity=" + quantity + "&deliveryDate=" + deliveryDate + "&IsUrgent=" + IsUrgent + "&processTypeInt=" + processTypeInt + "";
}
}
else {
location.href = "http://www.mamicode.com/Login?returnUrl=%2FHome/Plant";
}
});
var move = $(‘div#chebox2>.c3right>span‘)
var hide = $(‘div#chebox2>.Fs‘)
move.hover(function () { hide.show() }, function () {
hide.hide()
});
});
function getCount() {
//数量
var a1 = $(‘.t4 .combobox1‘);
var span1 = $(‘span.ed4‘)
if (a1.val() == ‘‘) {
span1.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
} else if (isNaN(a1.val())) {
span1.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
a1.val(‘‘)
return false;
} else if (a1.val() < 1) {
span1.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}else if(!(/(^[1-9]\d*$)/.test(a1.val()))){
span1.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}
else if (a1.val() > 0) {
span1.html(‘‘);
} else {;
span1.html(‘‘);
}
return true;
}
function getJg() {
//价格区间
var a1 = $(‘.combobox1:eq(0)‘)
var b1 = $(‘.combobox1:eq(1)‘)
var span = $(‘span.ed2‘)
if (a1.val() == ‘‘ || b1.val() == ‘‘) {
span.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}
else if (isNaN(a1.val()) || isNaN(b1.val())) {
span.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
a1.val(‘‘);
b1.val(‘‘);
return false;
}
else if (a1.val() < 1 || b1.val() < 1) {
span.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}
else if (a1.val() < b1.val()) {
span.html(‘‘)
}
else if (a1.val() > b1.val()) {
span.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}
else if (a1.val() == b1.val()) {
span.html(‘不能为空‘).css({ ‘color‘: ‘red‘ });
return false;
}
else {
span.html(‘‘);
}
return true;
}
//其他情况下未选择或者未输入的数据时
function getFalse(a, b) {
var a = $(a)
var b = $(b)
var t = true
if (a.val() != ‘‘) {
b.html(‘‘);
return true;
} else {
b.html(‘不能为空‘).css({ ‘color‘: ‘red‘ })
return false;
}
}
//$(function () {
// var move = $(‘div#chebox2>.c3right>span‘)
// var hide = $(‘div#chebox2>.Fs‘)
// move.hover(function () { hide.show() }, function () {
// hide.hide()
// })
// })
function getEvent(e) {
//事件冒泡
var event = e || window.event;
event.stopPropagation();
}
function getHide(s) {
//隐藏对应的标记
s.hide();
}
$(function () {
var itemcommbox = $(‘.Pdemand>form>#type div.t1 input[name="type1"]‘)
var itemcomm = $(‘.itemcommbox‘)
itemcommbox.click(function (e) {
getEvent(e);
itemcomm.show();
});
var itemcommU = $(‘.itemcommbox>.itemS>li‘);
itemcommU.on(‘click‘, function () {
var index = $(this).html();
itemcommbox.val(index);
itemcomm.hide();
});
$(document).click(function () {
// getHide($(‘.itemcommbox‘))
getHide($(‘.item_C‘))
});
});
//加工类型
$(function () {
var itemcommbox = $(‘.Pdemand>form>#type div.t21 input[name="type3"]‘)
var itemcomm = $(‘.iterF‘)
itemcommbox.click(function (e) {
getEvent(e)
itemcomm.show();
itemcomm.each(function () {
$(this).height(this.scrollHeight)
});
});
var itemcommU = $(‘.iterF>.itemS>li‘);
itemcommU.on(‘click‘, function () {
var index = $(this).html();
itemcommbox.val(index);
itemcomm.hide();
});
$(document).click(function () {
// getHide($(‘.itemcommbox‘))
getHide($(‘.iterF‘))
});
});
$(function () {
var box = $(‘.Pdemand>form>#type div.t0 input[name="type0"]‘)
box.click(function (e) {
getEvent(e);
var cetegoryT = $(‘#cetegoryT‘)
cetegoryT.show();
var catsub = $(‘.cat-sub‘)
cetegoryT.mouseenter(function () {
catsub.show();
});
catsub.mouseleave(function () {
// catsub.hide();
});
});
$(document).click(function () {
// getHide($(‘.itemcommbox‘))
getHide($(‘.cT‘))
});
});
/*选中之后，给父input*/
/*下拉选择*/
$(function () {
var box = $(‘.Pdemand>form>#type div.t0 input[name="type0"]‘)//总父名称
var cetegoryT = $(‘div.cT-Name‘)//父名称
var childpage = $(‘.childpage dl>dt>a‘)//子名称
cetegoryT.hover(function () {
var index = $(this).html();
childpage.click(function (e) {
var child = $(this).html();
var astring = index + ‘>‘ + child;
$("#CategoryIds").val($(this).attr("data-value-id"));
box.val(astring)
$(‘.cT‘).hide();
e.stopPropagation();
return false;
})
});
});
$(function () {
var cetegoryT = $(‘#cetegoryT>ul>li‘);
var childpage = $(‘.childpage‘);
cetegoryT.hover(function () {
$(this).addClass(‘scurrent‘).siblings().removeClass(‘scurrent‘)
var index = $(this).index();
childpage.hide();
$(‘.childpage:eq(‘ + index + ‘)‘).show();
});
});
javascript表单行为效果展示
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。