设置 DIV 可见 和 input button标签 是否可点击
<input name="Input42" type="button" id="catalogparagEidtID" value="段落内容编辑" class="button"/>
$(document).ready(function(){
// DIV设置为隐藏状态
document.getElementById('catalogParagID').style.display = "none";
if($("#catalogIdNew").val()) {
document.getElementById('catalogparagEidtID').disabled = "false"; // 段落内容编辑 按钮为不可点击状态
}else{
document.getElementById('catalogparagEidtID').disabled = "true"; // 段落内容编辑按钮为可点击状态
}
2 bind函数 增加鼠标滑过后给予友好提示:
// 给单选框设置友好提示DIV,通过bind函数,
所有JavaScript事件对象,比如focus, mouseover, 和 resize,都是可以作为type参数传递进来的。
如果注册了多个事件处理函数,总是按照绑定的顺序依次触发。
$('#radioID').bind({
mouseenter: function() {
$("#radioDivID").html("<font color=red>勾选是的话,则新创建的类目不能创建子类目</font>");
},
mouseout : function() {
$("#radioDivID").html("");
}
});
});
3 c:if 判空:
<c:if test="${empty catalogIdNew}">
添加类目
</c:if>
<c:if test="${!empty catalogIdNew}">
编辑${name }类目信息
</c:if>
4 详细页面中常用到的导航:
位置:一级类目A > 二级类目B
<p>
<c:set var="out" value=""/> 初始化一个作用于
<c:forEach items="${list}" var="catalog" varStatus="statu">
<c:if test="${statu.count==1}"><c:set var="out" value=" <a href='/product/list.do?typeid=${type.typeid}'>${catalog.name}</a> ${out}"/></c:if>
<c:if test="${statu.count>1}"><c:set var="out" value="<a href='/product/list.do?typeid=${type.typeid}'>${catalog.name}</a> > ${out} "/></c:if>
</c:forEach>
位置:<c:out value="${out}" escapeXml="false"></c:out>
</p>
后台只要准备一个有序封装好数据的list即可。
5 JS表单ajax post方式提交 和 字符串去掉左右空格
function addCataWithSameLevFun() {
// 1 通过post方式提交表单
var name = $("#name").val();
var orderNo = $("#orderNo").val();
var keyWord = $("#keyWord").val();
var identify = $("#identify").val();
var pid = $("#pid").val();
var level = $("#level").val();
var catalogIdNew = $("#catalogIdNew").val();
//var endValue = $("radio:checked").val();
var endValue = $("input:checked").val();
name = name.replace(/^\s+|\s+$/g,""); 去掉空格
identify = identify.replace(/^\s+|\s+$/g,"");
if(name == "" || identify == "" || orderNo < 1){
alert("请填写必填项,并保证顺序号大于0");
}else{
$.post('<c:url value="/catalog!addorUpdateCataWithSameLev"/>', {name:name,orderNo:orderNo,keyWord:keyWord,identify:identify,pid:pid,level:level,catalogIdNew:catalogIdNew,endValue:endValue},
function(data){
$('#first').html(data);// 更新 添加类目的div数据
//alert($("#catalogIdNew").val()) ;
if($("#catalogIdNew").val()) {
document.getElementById('catalogparagEidtID').enabled = "true"; // 段落内容编辑按钮为可点击状态
}
},
'html');
}
}
6 普通方式JS提交表单:
function goCatalogIndexFun() {
window.location.href="/catalog!index?";
}
7 input标签调用JS:
<input name="Input43" type="button" value="保存" class="button"/>
8 a 链接调用后台方法的JS写法:注意,调用JS的时候在使用EL表达式传递参数时,请加入 '',否则调用失效
<a onClick="doubleClickParagFun('${catalogIdNew }','${parag.id }')" href="#">${parag.tilte}</a>
9 在input text文本域移出的时候 调用的JS写法:
此时,页面中的input text域是动态由 foreach list生成的,因此动态根据 status生成需要获取文本的input 的id。
<input type="text" name="paragOrderNo" id="paragOrderNo${status.count}" onblur='updatePragFun(${status.count},"${parag.id}")' class="number"></input>
//段落流水号框在移出焦点后出发的JS函数
function updatePragFun(index, paragID){
// 获得当前被点击的段落的流水号和段落主键 然后调用后台 将此ID的段落修改
var paragOrderNo = "paragOrderNo" + index;
//alert($("#"+paragOrderNo).val()); 得到流水号的数值
var paragOrderNo = $("#"+paragOrderNo).val();
paragOrderNo = paragOrderNo.replace(/^\s+|\s+$/g,"");
if(paragOrderNo == ""){
alert("流水号不能为空");
}else{
if(!checkNum(paragOrderNo)) {
alert("流水号只能为数字形式");
}else{
// 流水号只有在数字情况下才可提交后台
$.post('<c:url value="/catalog!updateCataParagWithOrderNo"/>', {paragID:paragID,paragOrderNo:paragOrderNo},
function(data){}, 'html');
}
}
}
// 验证正整数的写法
function checkNum(data){
var type = "^[0-9]*[1-9][0-9]*$";
var rex = new RegExp(type);
if(data.match(rex)==null) {
return false;
}else{
//alert( "整数哦!");
return true;
}
}