将文本链接到另一页



我重新编辑了这个问题,因为我不确定这些答案是否合适。

这里有一个代码(index.html(:

<textarea id="myInput1" class="one" name="myInput1" readonly>
One
One
One</textarea>
</div> 

我需要什么:

我需要有另一个页面(text.html(,通过更改它我将能够编辑这个页面的文本。

因此,如果页面(text.html(将显示:text区域=二二两个

(index.html(中的文本区域也将相应地更新和更改。

您需要知道的第一件事是,您需要jQuery,更具体地说,它的load()函数可以让您将同一域中其他页面的数据加载到另一个页面上

您需要包含jQuery库,如下所示:

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

您可以使用jQuery.load()功能从另一个页面获取数据

$("#<parent div>").load(<content id>);

以下是一个完整的示例:

index.html

<textarea id="myInput1" class="one" name="myInput1" readonly>
One
One
One
</textarea>
<p><a href='text.html'>link to next Page</a><p>

text.html:

<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
</head>
<body>
<div id='content'>

</div>  
<script>
$( "#content" ).load( "index.html #myInput1" )
</script>
</body>

这需要几个步骤。

首先,你需要让你要传递的文本可以用于你要传递它的页面

传统的方法是将其编码到URL的查询字符串中。

<a href="mypage?text=One">One</a>

请注意,这很容易受到CSRF的攻击,因此,如果目标页面支持任意文本,则第三方可能会链接到您的页面,并向单击链接的人显示他们喜欢的任何内容(例如攻击性、欺诈性或诽谤性(,除非您采取措施防止这种情况发生。

如果您使用的是纯客户端JavaScript,那么您可以将其存储在localStorage中。然而,这取决于种族条件,因此,如果有人在多个页面上点击,并返回显示链接提供内容的页面,那么他们将从点击的最新链接中获得文本,即使是在另一个选项卡中。


其次,您需要从放置数据的任何位置读取数据。此问题涉及使用客户端JS读取查询字符串值。

如果您使用的是服务器端JS,那么您可能使用的是Express,在这种情况下,您可以使用request.query属性。

(前面关于localStorage的链接显示了如何使用它进行读写(。


第三,您需要将其插入页面。MDN有一个使用客户端JS操作文档的指南。

如果在服务器端执行此操作,则应该使用具有适当转义功能的模板引擎来防止XSS。


请注意,如果有很多相似的页面,但数据量很小,则可能会对重复内容造成惩罚。

您希望页面(例如index.html(包含3个链接:一个、两个、三个。在点击One之后,它移动到例如One.html,并且有一个链接";返回";来自href"index.html">
手册:<a href="one.html">One</a>
In-one.html:
手册<a href="index.html">Index</a>
其他
var element = document.getElementById(id);在JavaScript中。

最新更新