停止表单刷新,但发布

时间:2015-04-03 08:28:34

标签: javascript php jquery html forms

我正在一个广播网站上工作,有一个播放器,还有一堆横幅,你可以点击它来播放收音机。

我认为理想的行为是,如果我点击按钮播放收音机,它会跳转到播放器。但现在它刷新页面,并跳到页面顶部。这有点烦人。

  1. 我有一个带有多个按钮的表单,这些按钮包含数据库中收音机的ID。
  2. 然后我得到了我的播放器,没有发布表单,打印默认播放器,在提交表单时,它会加载数据库中所需的所有信息以及发布到的ID玩家。
  3. 现在我的问题是,如何阻止表单刷新并跳回到页面顶部,同时它会发布到播放器。

    如果你们需要任何代码,我希望在这里发布它,但是因为我的index.php上有一堆代码,我需要一个可以把它放在上面的网站。

3 个答案:

答案 0 :(得分:0)

你会想要使用Javascript(更具体地说:AJAX)。这可能看起来令人生畏,但特别是在组合使用with jQuery时,它是非常可行的。

这个想法基本上是在不重新加载页面的情况下将请求发送到背景上的其他页面,并使用Javascript用新接收的信息更新当前页面。关于这个主题有很多资源可以更好地解释细节,但我希望这能给你足够的关键词:)

答案 1 :(得分:0)

基于Web的广播播放器通常是SPA(单页应用程序),因为重新加载页面会中断广播播放器。这意味着页面只加载一次,所有其他内容都是通过不需要重新加载整个页面的AJAX请求加载的。

您可以使用几个库来实现此体系结构(例如Angular.JS)。使用简单的JS从头开始构建这样的架构很容易维护。

答案 2 :(得分:0)

在这里你可以使用ajax然后调用你的无线电播放器...... 查看以下示例。

$("button").click(function(){
    $.ajax({url: "demo_test.txt", 
            success: function(result){
                     $("#div1").html(result);
            }
    });
});

希望这会有所帮助。