Javascript 停止刷新表单，但不要发布

我在一个电台网站上工作，有一个播放机和一堆横幅，你可以点击播放电台

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

我得到了一个有多个按钮的表单，这些按钮包含数据库中收音机的ID

然后我得到了我的播放器，没有表单被发布，打印了一个默认播放器，在提交表单时，它将从数据库中加载所有需要的信息，其中包含发布给播放器的ID

现在我的问题是，如何阻止表单刷新并跳回页面顶部，同时将表单发送给播放器

---

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

你们会想使用Javascript（更具体地说：AJAX）来实现这一点。它可能看起来令人望而生畏，但特别是在组合使用时，它是完全可行的

---

其基本思想是在后台向不同的页面发送请求，而无需重新加载页面，并使用Javascript使用新收到的信息更新当前页面。关于这一主题，有很多资源在解释细节方面比我在这里做得更好，但我希望这能为您提供足够的关键字：）

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

---

有几个库可用于实现此体系结构（例如Angular.JS）。用简单的JS从头开始构建这样的体系结构很容易变得很难维护。

在这里，您可以使用ajax，然后调用不正常的无线电播放器。。。 找到下面的例子

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

---

希望这会有所帮助。

考虑使用ajax，以便在满足所有必要要求的情况下完成这项工作。使用jquery或javascript单击按钮并执行一些活动。我对ajax jquery或Js没有经验，所以如果你们能在这方面帮我，我将不胜感激。：）“按钮”是ID还是按钮名？为什么url demo_test.txt？你使用的是id然后使用#idOfButton，如果是类，那么就使用。ClassOFButton你可以通过使用类使它成为通用的，所以在这个方法将调用的所有按钮上，在数据部分，你可以传递所选按钮的电台。这只是一个例子。你需要传递你在表单操作中定义的url。我使用的是按钮的ID，因为所有的按钮ID都是相同的，仍然没有成功。仍然跳到页面顶部我将查看是否可以找到任何内容，我没有使用两种语言的经验tho。。