【问题标题】:Change HTML code without refreshing the page在不刷新页面的情况下更改 HTML 代码
【发布时间】:2013-04-04 10:11:43
【问题描述】:

有没有可能how to change HTML(.jsp)页面without refreshing呢?

用例是用户写一些东西到 textarea 然后点击一些按钮,然后我需要添加一些对象,即图片到我页面中先前定义的位置~~~> 我需要更改 HTML 代码而不刷新页面(没有丢失文本框中的文本)。我确实需要更改 HTML 代码,所以请不要在不更改 HTML 代码的情况下建议任何解决方案。

我不是很喜欢前端技术,所以我什至不知道这是否可能,如果这是一个愚蠢的问题,请原谅。

我只能使用前端技术。

【问题讨论】:

  • 这太笼统了,以至于它描述了过去大约 10 年的大量 JavaScript。我建议您看看 JQuery - 它可能会帮助您满足您的需求。
  • 哦..谢谢...正如我所说 - 我通常用 java 编写后端,所以我不知道前端技术提供什么以及可能性是什么。我会看看这个:)
  • 查看 javascript event handlers 和动态 DOM 元素创建/CSS 显示属性。
  • 老实说,我对此投了赞成票。是的,它很模糊,但我认为会有很多前端初学者在尝试完成这样的事情时会搜索这些确切的词。这是一个很好的机会,可以帮助未来的初学者找到正确的方向。

标签: javascript html web-applications frontend


【解决方案1】:

使用 jQuery(一个 JavaScript 库),您可以利用 load() 函数在您的服务器上加载另一个 HTML 文件的内容,并将其放置在当前页面上您想要的任何位置,而无需刷新(因此您甚至可以替换当前的 HTML,如果你喜欢)。

jQuery:
http://jquery.com/

jQuery load():
http://api.jquery.com/load/


替代建议:
但是,我知道你说你不能刷新页面,但是,如果唯一的原因是因为你需要将文本保留在文本框中,你可以使用一个表单来POST那个文本到另一个.jsp 页面(甚至是相同的.jsp 页面,这取决于您如何处理),您可以自行决定使用它(例如,将其放在另一个文本框中)。

【讨论】:

  • nah ..您的替代解决方案太复杂了...我只需要在用户不需要时将新选项卡添加到某个选项卡组件..而且我不想要只是因为这会将有关表单等文本的所有信息发送到服务器上的控制器,并将其返回到相同的视图,仅更新..就像用左手抓挠右耳.. :)
  • @Dworza 哈哈好吧! jQuery 是一个很棒的库,我希望它对你有所帮助。一切顺利。
【解决方案2】:

也许这对你有用。

<div id="mydiv"></div>
<a id="refresh">click</a>

<script>
$(function() {
  $("#refresh").click(function() {
     $("#mydiv").load("yourdomain.com/file.php")
  })
})

另见:

http://woork.blogspot.nl/2007/10/how-to-change-text-using-javascript.html

【讨论】:

    【解决方案3】:

    使用JavaScript,以便您可以更改Document Object Model 它非常容易学习并且非常强大。

    【讨论】:

      【解决方案4】:

      您应该使用 javascript 函数 document.getElementById (DIV THAT YOU WOULD LIKE TO PLACE IN).innerHTML = YOUR_TEXT;.

      如果您需要服务器的响应而不重新加载页面(您仍然需要加载,但客户端不会注意到),请尝试使用 AJAX。

      【讨论】:

        【解决方案5】:

        是的,这是可能的。您应该使用 JavaScript 更改用于显示页面的 HTML。

        您可能会发现使用 JQuery 之类的库很有用。

        【讨论】:

          猜你喜欢
          • 2020-10-31
          • 2022-11-27
          • 2016-03-20
          • 2018-02-23
          • 2011-09-01
          • 2016-05-25
          • 2017-03-24
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多