简易在线投票系统(php)——前端设计（js部分）

本文主要是介绍简易在线投票系统(php)——前端设计（js部分），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1、交换显示两个div的方法

即将一个div的display属性设置为空的同时，将另一个div的display属性设置为none。注意，这两个属性不能再css文件中设置，而要在html页面设置，因为js只能读取和修改html页面的内容。

function showDiv(divName1,divName2){var divName1=document.getElementById(divName1);var divName2=document.getElementById(divName2);if(divName1.style.display=='none'){divName2.style.display='none';divName1.style.display='';}else{divName2.style.display='none';divName1.style.display='';}
}

2、让一个div隐藏的方法

我们需要在成功登陆或注册成功后自动隐藏登陆和注册框，而使用户正常的浏览页面

function exitDiv(divName){var divName=document.getElementById(divName);if(divName.style.display==''){divName.style.display='none';}else{divName.style.display='none';}
}

3、专门使用在发布投票页面的添加选项功能

发布者在输入选项数目后，点击确定，将自动生层相应数目的输入框。

//添加选项
function addVote(){var i=document.getElementById('voteCount').value;var addVote=document.getElementById('addVote');var newDiv=document.getElementById('newDiv');var div;if(i<1){i=1;document.getElementById('voteCount').value=1;}if(newDiv){newDiv.remove();div=document.createElement('div');div.id='newDiv';}else{div=document.createElement('div');div.id='newDiv';}var addHtml='<table>';for(var j=1;j<=i;j++){addHtml=addHtml+' <tr><td>  第'+j+'个选项</td><td>：<input type="text" name="'+j+'" size="20"/></td></tr>';}addHtml=addHtml+'</table>';div.innerHTML=addHtml;addVote.appendChild(div);
}

4、js中用来使页面发生跳转的方法

location.href='index.php'

5、页面引入js的位置技巧

（1）因为js是在页面加载的过程中运行的，所以需要在页面加载完成后再运行js文件，以防js在运行的过程中，找不到html中的代码。

（2）php的运行有一些需要调用js来实现，为了保证党php运行时，js也可以正常运行，要将必要的php代码放在js之后。

所以js文件的引用一般放在页面的末尾，同时将必要的php代码放在js之后。

<script language="javascript" type="text/javascript" src="./jsFunction.js"></script>
<?php
//在js之后用来调用js文件中的方法，使div变换
$ouser=@$_GET['user'];
if($ouser != ''){echo "<script>showDiv('top1','top2');</script>";
}
?>

这篇关于简易在线投票系统(php)——前端设计（js部分）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---