[英]How would I bring in Jquery items to update an index.erb in Sinatra?
So I have a simple game, in the index.erb, the code is as follows: 所以我有一个简单的游戏,在index.erb中,代码如下:
<div class="battleInfo">
<h2> Your HP: <%= @my_knight.hp %> </h2>
<h2> Dragon HP: <%= @my_dragon.hp %> </h2>
<h1> <%= @results %> </h1>
</div>
I want to use Jquery in the public folder as app.js, to update the HP info so we can see the whole run down of the characters and how they die. 我想在公共文件夹中将Jquery用作app.js,以更新HP信息,以便我们可以看到字符的全部消耗以及它们如何死亡。
The JS code: JS代码:
function postHP() {
$(".battleInfo").append(my_knight.hp);
$(".battleInfo").append(my_dragon.hp);
};
I get an error that my_knight is not defined. 我收到未定义my_knight的错误。 If I use
@my_knight
, it says the @
is an illegal character. 如果我使用
@my_knight
,则表示@
是非法字符。
It's my first week of Ruby and I'm not sure how to get this to work and can't find the answer online. 这是我使用Ruby的第一周,我不确定如何使它正常工作,并且无法在线找到答案。
I guess the basic question would be how to get info from js into sinatra. 我想基本的问题是如何从js获取信息到sinatra。 I have the CSS working just fine.
我的CSS工作正常。
Any help is appreciated, thanks 任何帮助表示赞赏,谢谢
Firstly, you need to understand what is happening where/when. 首先,您需要了解何时何地发生了什么。 Firstly, client is making a request.
首先,客户正在提出请求。 Rails receives a request, instantiate controller, which sets instance variables.
Rails接收实例化控制器的请求,该请求设置实例变量。 Then rails gets your erb file, finds all
<%.. %>
blocks and substitute/execute commands in there. 然后,rails获取您的erb文件,在其中找到所有
<%.. %>
块并替换/执行命令。 This results in pure HTML which is being send back to the customer. 这导致纯HTML被发送回客户。
When customer receives html, it loads all the css and javascript files referenced in this html. 当客户收到html时,它将加载此html中引用的所有css和javascript文件。 This javascript has absolutely no access to controller's instance variables - it has no idea they have ever existed, it has no idea it is rails application, doesn't know what controller is etc.
这个javascript绝对无法访问控制器的实例变量-它不知道它们是否曾经存在过,它不知道它是Rails应用程序,也不知道控制器是什么,等等。
The most common way to pull any sort of data back to the view is to send an AJAX - this means that the browser will make an additional call to your server, which will return a JSON object, understandable by javascript and which can be used to update the loaded HTML. 将任何类型的数据拉回视图的最常见方法是发送AJAX-这意味着浏览器将对您的服务器进行额外的调用,这将返回一个JSON对象,可被javascript理解并且可以用来更新加载的HTML。
There are number of steps to implement this. 有许多步骤可以实现这一点。 First of all, you need to create a new action in your controller, like
update_hp
or sth. 首先,您需要在控制器中创建一个新动作,例如
update_hp
或sth。 Then you have to trigger AJAX call with your javascript and define a handler (functions) to handle successful response from the server. 然后,您必须使用JavaScript触发AJAX调用,并定义一个处理程序(函数)以处理来自服务器的成功响应。 This handler will most likely update the requested fields.
该处理程序很可能会更新请求的字段。
You can see some examples on how to build AJAX request here , and some details on building json responses here . 你可以看到如何构建AJAX请求一些例子在这里建设JSON响应,以及一些细节在这里 。 The topic is too broad to describe it here.
该主题太宽泛,无法在此处进行描述。 Give it a go and come back when you're stuck.
试一试,遇到困难时再回来。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.