dedecms模板留言板js拓展開發(fā)

官方的dedecms留言板模板可以接受的留言信息比較少,只有昵稱、emai、QQ、留言內(nèi)容等少數(shù)幾個(gè)字段。

怎樣實(shí)現(xiàn)dedecms留言板功能的擴(kuò)展。增加留言字段呢？

這里介紹的方式，采用js方式，輕松的實(shí)現(xiàn)了留言字段的擴(kuò)展。

這里提供一個(gè)相對(duì)完整的dedecms留言板表單。

<form action="/plus/guestbook.php"onSubmit="return check_mess_info()"name="form1" id="messform" method="post">
<input type='hidden' name='action' value='save' />
<!--mess_main-->
<div id="mess_main">
<div class="mess_list">
<div class="mess_title">正文</div><div class="mess_textarea"><textarea name="msg" id="mess_message_" rows="6" cols="36" value=''></textarea></div>
</div>
<table border=0 align=center cellpadding=10 cellspacing=0 width=98% class="form" style=" margin:0 auto ">
<tbody>
<tr><td width=20%>單位名稱</td><td><input id='uname' type='text' size='80' name='uname' value='<?php echo $g_name; ?>' />*</td></tr>
<tr><td width=20%>地址</td><td><input id='f2' type='text' name='f2' size='80' value=''/></td></tr>
<tr><td width=20%>公司地址</td><td><input id='f3' type='text' name='f3' size='80' value=''/></td></tr>
<tr><td width=20%>郵政編碼</td><td><input id='f4' type='text' name='f4' size='80' value=''/></td></tr>
<tr><td width=20%>E-mail</td><td><input id='f5' type='text' name='f5' size='80' value=''/></td></tr>
<tr><td width=20%>電話</td><td><input id='f6' type='text' name='f6' size='80' value=''/></td></tr>
<tr><td width=20%>傳真</td><td><input id='f7' type='text' name='f7' size='80' value=''/></td></tr>
<tr><td width=20%>聯(lián)系人</td><td><input id='f8' type='text' name='f8' size='80' value=''/></td></tr>
<tr><td width=20%>職務(wù)</td><td><input id='f9' type='text' name='f9' size='80' value=''/></td></tr>
<tr><td width=20%>展品名稱（中文）</td><td><input id='f10' type='text' name='f10' size='80' value=''/></td></tr>
<tr><td colspan="2"><strong>展品范圍</strong></td></tr>
<tr><td colspan="2"><table cellspacing="0">
<tr>
<td><input type='checkbox' name='f11' value='數(shù)控機(jī)床與金屬加工展' /> 數(shù)控機(jī)床與金屬加工展<div style="display:none">展品大類：金屬切削機(jī)床、金屬成形機(jī)床、特種加工機(jī)床、數(shù)控系統(tǒng)、數(shù)顯裝置和機(jī)床電器、機(jī)床零部件及輔助設(shè)備、磨料磨具、刀具、工夾具及相關(guān)產(chǎn)品、檢驗(yàn)和測(cè)量設(shè)備</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='工業(yè)自動(dòng)化展' /> 工業(yè)自動(dòng)化展<div style="display:none">展品大類：生產(chǎn)自動(dòng)化、過(guò)程自動(dòng)化、機(jī)器人技術(shù)、電氣系統(tǒng)、工業(yè)自動(dòng)化信息技術(shù)及軟件、微系統(tǒng)技術(shù)</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='環(huán)保技術(shù)與設(shè)備展' /> 環(huán)保技術(shù)與設(shè)備展<div style="display:none">展品大類：廢棄物處理和回收利用技術(shù)與設(shè)備、水處理技術(shù)與設(shè)備、循環(huán)經(jīng)濟(jì)及資源綜合利用、交通節(jié)能技術(shù)與設(shè)備、新能源技術(shù)與設(shè)備、建筑節(jié)能</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='信息與通信技術(shù)應(yīng)用展' /> 信息與通信技術(shù)應(yīng)用展（城市LED照明與新型顯示展）<div style="display:none">展品大類：通信及網(wǎng)絡(luò)產(chǎn)品、集成電路及電子元器件、計(jì)算機(jī)軟硬件及推廣應(yīng)用、信息安全、電源及相關(guān)產(chǎn)品、顯示及視聽產(chǎn)品、半導(dǎo)體照明</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='新能源與電力電工展' /> 新能源與電力電工展<div style="display:none">展品大類：新能源技術(shù)及設(shè)備、發(fā)電設(shè)備、電力電工技術(shù)、電力測(cè)控儀器、電氣自動(dòng)化技術(shù)與設(shè)備、輸電、配電設(shè)備及附件</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='科技創(chuàng)新展' /> 科技創(chuàng)新展<div style="display:none">展品大類：設(shè)企業(yè)與科、教等系統(tǒng)兩個(gè)板塊、主要展出企業(yè)、科研機(jī)構(gòu)和大專院校的科技創(chuàng)新成果</div></td>
</tr>
<tr>
<td><input type='checkbox' name='f11' value='新能源汽車展' /> 新能源汽車展<div style="display:none">展品大類：交易、展示 混合動(dòng)力汽車、電動(dòng)汽車、燃料電池汽車等新能源汽車、驅(qū)動(dòng)系統(tǒng)、充電設(shè)施、相關(guān)零部件、汽車設(shè)計(jì)</div></td>
</tr>
<tr>
<td colspan="3"><input type='checkbox' name='f11' value='航空航天技術(shù)展（航空航天技術(shù)展為雙年展，逢單年舉辦）' /> 航空航天技術(shù)展（航空航天技術(shù)展為雙年展，逢單年舉辦）</td>
</tr>
</table></td></tr>
<tr>
<td colspan="2"><strong>公司性質(zhì)</strong></td>
</tr>
<tr><td colspan="2"><table cellspacing="0">
<tr>
<td><input name='f12' type='radio' value='國(guó)營(yíng)企業(yè)' checked="checked" /> 國(guó)營(yíng)企業(yè)</td>
<td><input name='f12' type='radio' value='民營(yíng)企業(yè)' /> 民營(yíng)企業(yè) </td>
<td><input name='f12' type='radio' value='中外合資/合作企業(yè)' /> 中外合資/合作企業(yè)</td>
<td><input name='f12' type='radio' value='代理國(guó)際品牌的內(nèi)資企業(yè)' /> 代理國(guó)際品牌的內(nèi)資企業(yè)</td>
</tr>
<tr>
<td><input name='f12' type='radio' value='港澳臺(tái)企業(yè)' /> 港澳臺(tái)企業(yè)</td>
<td><input name='f12' type='radio' value='外商獨(dú)資企業(yè)' /> 外商獨(dú)資企業(yè)</td>
<td><input name='f12' type='radio' value='境外企業(yè)' /> 境外企業(yè)</td>
<td><input name='f12' type='radio' value='境外企業(yè)國(guó)內(nèi)辦事處' /> 境外企業(yè)國(guó)內(nèi)辦事處</td>
</tr>
</table></td></tr>
<tr><td colspan="2"><strong>預(yù)定展位</strong></td></tr>
<tr><td colspan="2">A.標(biāo)準(zhǔn)展位 9平方米（3米×3米）標(biāo)準(zhǔn)展臺(tái)<input id='f13' type='text' name='f13' size='5' value=''/>
個(gè)</td></tr>
<tr><td colspan="2">B.室內(nèi)光地（18平方米起租）長(zhǎng)
<input type='text' id='f14' name='f14' size='5' value=''/>
米 × 寬
<input type='text' name='f15' id='f15' size='5' value=''/>
米</td></tr>
<tr><td colspan="2">C.室外光地（50平方米起租）
<input type='text' name='f16' id='f16' size='5' value=''/>
平方米</td></tr>
<tr>
<td colspan="2" align="center">
<div class="mess_list">
<div class="mess_title" style=" height:30px; line-height:30px;">安全問(wèn)題</div><div class="mess_input"><img style="position:relative;top:3px;margin-right:4px;" id="login_captcha" src="../include/vdimgck.php" class="captchaimg" border="0" />
<input type="text" name="validate" id="mess_rand_rs_" value="" style="width:52px;" />*</div>
</div>

<input style="border:none " name="Submit" type="submit" class="subd" value="提交" />

</td>
</tr>
</tbody>
</form>
</table>

<div class="message_bg"></div>
</div>
<!--mess_main end-->
<div class="list_bot"></div>
</div>

</form>

表單中可以提交的信息非常多，如果都做成字段，需要修改數(shù)據(jù)庫(kù)字段，費(fèi)時(shí)費(fèi)力。

使用js方式就非常方便了。

關(guān)鍵的來(lái)了。下面是實(shí)現(xiàn)表單提交的js代碼：

<script type="text/javascript" language="javascript">
<!--
function check_mess_info(thisForm)
{
var str="";
str=str+"單位名稱:"+document.getElementById("uname").value+"\n";
str=str+"地址:"+document.getElementById("f2").value+"\n";
str=str+"公司地址:"+document.getElementById("f3").value+"\n";
str=str+"郵政編碼:"+document.getElementById("f4").value+"\n";
str=str+"E-Mail:"+document.getElementById("f5").value+"\n";
str=str+"電話:"+document.getElementById("f6").value+"\n";
str=str+"傳真:"+document.getElementById("f7").value+"\n";
str=str+"聯(lián)系人:"+document.getElementById("f8").value+"\n";
str=str+"職務(wù):"+document.getElementById("f9").value+"\n";
str=str+"展品名稱（中文）:"+document.getElementById("f10").value+"\n";
str=str+"展品范圍:"+checkall()+"\n";
str=str+"公司性質(zhì):"+chk()+"\n";
str=str+"預(yù)定展位:"+"\n";
str=str+"A.標(biāo)準(zhǔn)展位 9平方米（3米×3米）標(biāo)準(zhǔn)展臺(tái):"+document.getElementById("f13").value+"個(gè)"+"\n";

str=str+"B.室內(nèi)光地（18平方米起租）長(zhǎng):"+document.getElementById("f14").value+"米*"+"寬:"+document.getElementById("f15").value+"米"+"\n";

str=str+"C.室外光地（50平方米起租）:"+document.getElementById("f16").value+"\n";

document.getElementById("mess_message_").value = str;

}

function checkall()
{
var str="";
var c=document.getElementsByName("f11");
for(var i=0;i <c.length;i++)
{
if(c[i].checked==true)
{
str=str+c[i].value+" | ";
}
}
return str;
}
function chk(){
var obj = document.getElementsByName('f12');
for (i=0;i<obj.length;i++){
if (obj[i].checked){
var str=obj[i].value;
}
}
return str;
}

-->
</script>
代碼比較多，時(shí)間關(guān)系，沒(méi)有精簡(jiǎn)代碼。

對(duì)于要擴(kuò)展dedecms留言板的朋友很有幫助。