将按钮值发布到不同的html文件

时间:2014-09-09 13:09:30

标签: javascript jquery html

基本上我有两个按钮,点击它们时会更新datatable

<html>
    <head>
        <script type="TEXT/JAVASCRIPT">
            function seta() {
                document.let.out.value = "s"
            }

        </script>
    </head>
    <body>
        <form action="#" name="let">

            <input type=BUTTON value="s" onclick="seta()">


            <table id="dataTable" width="350px" border="1">
                <td width="177" align="left"><strong>eggs</strong></td>
                </TR>

                <td><output type=TEXT name="out" size=60 enabled>  </td>
                </TR>

                <td><output type=TEXT name="poo" size=60 disabled>  </td>
            </table>
    </body>
</html>

我想要实现的是将按钮放在一个html文件中,比如page1.html

<html>
    <head>
        <script type="TEXT/JAVASCRIPT">
            function seta() {
                document.let.out.value = "s"
            }
        </script>



    </head>
    <body>

        <form action="#" name="let">


            <input type=BUTTON value="s" onclick="seta();">


    <body />
<html />

哪个会更新其他html文件中的datatable,比如page2

<html>

    <head>
<script type="text/javascript">
      src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js">
          }

            function seta() {
                document.let.out.value = "s"

            }



        </script>

    </head>




    <body>
        <table id="dataTable" width="350px" border="1">
            <td width="177" align="left"><strong>eggs</strong></td>
            </TR>

            <td><output type=TEXT name="out" size=60 disabled></td>
            </TR>

        </table>
    </body>
</html>

我几乎是一个完整的菜鸟,所以任何帮助都将非常感谢,谢谢:)

2 个答案:

答案 0 :(得分:0)

您可以使用AJAX或涉及活动服务器的类似技术来完成此操作。您的一个页面会将一些信息推送到服务器,另一个页面会从服务器检索它,更新其值。

不使用服务器端技术,如果你是一个完整的noob&#34;正如你所说,你可能会更舒服,你可以使用iframe完成此任务。创建一个包含两个iframe的页面,一个页面包含按钮,另一个页面包含按钮操作的内容。

快速搜索显示this page,告诉您如何从其他iframe操纵iframe的内容。

但是,我想补充一点,你应该考虑一下你是否真的需要将文件分开。如果您希望在浏览器中查看一个页面以在服务器上仍然存在的情况下更改另一个文件,那么您将无法仅使用Javascript,这可能是一个糟糕的主意开始用。但是,如果两个文件同时在同一浏览器中显示同一布局的一部分,那么为什么它们需要分开?您是否无法将它们合并为一个包含整个布局的较大HTML文件?

答案 1 :(得分:0)

确定!所以我找到了一个非常有见地的关于cookie here的初学者教程,它引导我进入一个富有成效的夜晚,至少现在有一些结果......以下是我所拥有的......

//this is to send the cookie "cooked"

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
cookie_name = "cooked";
var send;

function putCookie() {

if(document.cookie != document.cookie) 
{index = document.cookie.indexOf(cookie_name);}
else 
{ index = -1;}
if (index == -1)
{
send=document.it.itr.value;
document.cookie=cookie_name+"="+send+"; expires=Wednesday, 01-Jan-2020 05:00:00 GMT";}
}
</SCRIPT>

<FORM NAME="it">
Enter A Word: <INPUT TYPE="text" NAME="itr" size="20">
<INPUT TYPE="button" Value="send cookies!" 
onClick="putCookie()">
</FORM>

<body/>
</head>
<html/>


//this is to receive the cookie "cooked"

<html>
<head>

<SCRIPT LANGUAGE="JavaScript">

cookie_name = "cooked";
var received;

function getName() {
if(document.cookie)
{
index = document.cookie.indexOf(cookie_name);
if (index != -1)
{
namestart = (document.cookie.indexOf("=", index) + 1);
nameend = document.cookie.indexOf(";", index);
if (nameend == -1) {nameend = document.cookie.length;}
received = document.cookie.substring(namestart, nameend);
return received;
}
}
}

received=getName();
if (received == "cooked")
{received = "Nothing_Entered"}
</SCRIPT> 


<SCRIPT LANGUAGE="javascript">
document.write("<FORM>")
document.write("you wrote:") 
document.write("<INPUT TYPE=text SIZE=30 VALUE=" +received+ ">");
document.write("</FORM>")
</SCRIPT>
    </BODY>
    </head>
    </HTML>


which works great, although it obviously won't function on ios...