如何将html中的值传递给js

JavaScript011

如何将html中的值传递给js,第1张

JS方式实现静态页之间值传递,参考如下:

在body标签之间加此行代码:

<form action=”a.html?d1=123&d2=你好” method=”post” name=”f1″ id=”f1″>

<input type=”submit” name=”s1″ id=”s1″ value=”提交”/>

</form>

然后,新建a.html新页,同样在body标签之间加此行代码,如下:

<script type=”text/javascript”>

var tmpArr

var QueryString

var URL = document.location.toString()

if(URL.lastIndexOf(“?”)!=-1){

QueryString= URL.substring(URL.lastIndexOf(“?”)+1,URL.length)

tmpArr=QueryString.split(“&”)

for (i=0i<=tmpArr.length – 1i++) {

document.write(“参数为:” + tmpArr[i] + “<br/>”)

}

}

else{

QueryString = “”

}

</script>

可以利用form表单提交获取上一个页面的值

例:form表单提交传值及取值

发请求页面

<form style="display: none" method="post"

       id="infoDetailsHyperlink" name="input"

       action="<%=request.getContextPath()%>/view/basicmanage/reportTemplet/positionPeopleConfig.jsp">

       <input name="infoId" id="infoId">

       <input name="operationType" id="operationType">

       <input name="copyTempletIdConfigPeople" id="copyTempletIdConfigPeople">

</form>

发请求页面,js中发送请求

$("#infoId").val($("#lastStepTempletId").val())

$("#operationType").val($("#operationTypeIdLastStep").val())

$("#infoDetailsHyperlink").submit()

接收页面

<input  id="infoId" style="display: none"  value=<%=request.getParameter("infoId")%>>

<input  id="operationType" style="display: none"   value=<%=request.getParameter("operationType")%>> 

<input  id="copyTempletIdConfigPeople" style="display: none"   value=<%=request.getParameter("copyTempletIdConfigPeople")%>>

<script>

<%request.setCharacterEncoding("utf-8")%>     解决传值时中文乱码问题

</script>

几种JSP页面传值方式:

1. 隐藏域传值:

<form method="post" action="client_crud.jsp" >

<input type="hidden" name="id" value="<%=id %>">

2. URL传值:

用button

a.

<input name="btnModify" type="button" class="button1" onClick="self.location='client_modify.jsp?id=<%=id %>'"

value="修改分销商" />

b.把input的onClick=”modifyRegion()”

function modifyRegion() {

window.self.location = client_node_modify.jsp?id=<%=id%>"

}

3. JS方式传值

//取得form对象提交表单

with(document.getElementById("userForm")) {

method="post"

action="user_add.jsp?command=add"

submit()

}

function searchItem() {

with(document.forms[0]) {

action="servlet/basedata/SearchItemServlet"

method="post"

submit()

}

}

JSP的几种参数传值:

一、超链接

<a href="P.jsp?username=zhangshan&pwd=123456&age=25">链接</a>

二、forma表单

1.可显示的控件

<input type="text" name="username">

2.如果要传递的值,不需要显示在页面上

(1)<input type="hidden" name="pwd" value="<%=pwd%>">

(2)<form action="XXX.jsp" method="post"></form>

三、JSP的include和forward标签

<jsp:include flush="true" page="T.jsp?username=zhangshan&pwd=123456678">

<jsp:param name="age" value="28"/>

</jsp:include>

四、JavaScript方式

script type="text/javascript">

function demo(){

var v = document.all('username').value

location.replace("V.jsp?username="+v+"&age=25")

}

</script>

<input type="text" name="username"><br>

<input type="button" value="href点击" onclick="location.href='V.jsp?pwd=123456'"><BR>

<input type="button" value="replace点击"

onclick="location.replac('V.jsp?pwd=123456789')">

<br>

<input type="button" value="动态取值" onclick="demo()">