Ajax新手学习(使用golang和jquery)

huangapple go评论84阅读模式
英文:

Ajax newbie learning (golang jquery)

问题

好的,我已经仔细查看了stackoverflow上的解决方案,以使我的代码能够正常工作,我相信我已经接近成功了,但我无法确定为什么我的代码不起作用。

所以,我正在尝试构建一个动态内容页面,并通过点击将ajax请求发送到我的笔记,以允许它们展开、查看和编辑。

这是我尝试使用的脚本:

<script>
$('.notes').on('click',function (e){
   alert("ok");
   $.ajax({
    type:'GET',
    url :'localhost:8080/editnote',
    dataType: 'html',
    success: function(data) {
        console.log('success',data);
	    $('#interactive').html(data);

    },
    error: function(jqXHR,textStatus,errorThrown ){
       alert('Exception:'+errorThrown );
    }
});
 e.preventDefault();
});
</script>

现在,这是我正在尝试与之交互的golang代码片段。由于handlefunc从未注册故障排除fmt println,它似乎根本无法连接到我的服务器。

handlefunc代码片段:

func test(w http.ResponseWriter, r *http.Request) {
	fmt.Println("code got here")
	s := `Here is some text from test`
	fmt.Fprintln(w, s)
}

这是main()代码片段:

func main() {
	http.HandleFunc("/editnote", test)
	http.ListenAndServe(":8080", nil)
}

对此的任何见解都将非常重要。非常感谢您查看这个问题。

编辑:我忘了提到脚本上的警报成功触发,所以点击脚本是有效的,只是ajax不起作用。

编辑2:通过开发者控制台:

Uncaught TypeError: $.ajax is not a function
    at HTMLDivElement.<anonymous> ((index):153)
    at HTMLDivElement.dispatch (jquery-3.2.1.slim.min.js:3)
    at HTMLDivElement.q.handle (jquery-3.2.1.slim.min.js:3)

更新:经过我在控制台上的一些调查,问题似乎是我使用了一个精简版本的jquery 3.2.1。在切换到一个非精简版本的压缩文件后,我收到了服务器对查询的响应!我在这个应用程序上还有很多工作要做,但这是一个非常有价值的解决方案!非常感谢帮助我诊断这个问题的每个人!

英文:

Ok, so I have thoroughly scoured stackoverflow looking for solutions that can make my code work, and I believe I am close, but I cant tell exactly why my code isnt working.

So, I am trying to build a dynamic content page and have an ajax request sent from click onto my notes to allow them to be expanded and viewed, and edited.

Heres the script I am trying to use:

&lt;script&gt;
$(&#39;.notes&#39;).on(&#39;click&#39;,function (e){
   alert(&quot;ok&quot;);
   $.ajax({
    type:&#39;GET&#39;,
    url :&#39;localhost:8080/editnote&#39;,
    dataType: &#39;html&#39;,
    success: function(data) {
        console.log(&#39;success&#39;,data);
	    $(&#39;#interactive&#39;).html(data);

    },
    error: function(jqXHR,textStatus,errorThrown ){
       alert(&#39;Exception:&#39;+errorThrown );
    }
});
 e.preventDefault();
});
&lt;/script&gt;

Now, here is the golang snippet I am trying to get it to interact with. It doesn't seem to be connecting whatsoever to my server since the handlefunc never registers the troubleshooting fmt println.

handlefunc snippet:

func test(w http.ResponseWriter, r *http.Request) {
	fmt.Println(&quot;code got here&quot;)
	s := `Here is some text from test`
	fmt.Fprintln(w, s)
}

and here is the main() snippet:

func main() {
	http.HandleFunc(&quot;/editnote&quot;, test)
	http.ListenAndServe(&quot;:8080&quot;, nil)
}

Any insight here would be highly valued. Thank you so much for reviewing this question.

edit: I forgot to mention that the alert on the script successfully fires, so the on click script is working, just not the ajax.

edit2: via developer console:

Uncaught TypeError: $.ajax is not a function
    at HTMLDivElement.&lt;anonymous&gt; ((index):153)
    at HTMLDivElement.dispatch (jquery-3.2.1.slim.min.js:3)
    at HTMLDivElement.q.handle (jquery-3.2.1.slim.min.js:3)

Update: it appears that the issue here after i did some digging about the console was that i was using a slim version of jquery 3.2.1. After switching to a minified non-slim version, i am getting server responses to the query! I still have loads of work to do on this app, but this was a very valued solution! Thanks very much to everyone who helped me diagnose this problem!

答案1

得分: 1

似乎jQuery的精简版本不支持ajax函数。所以尝试包含jquery-3.2.1.min.js,它会起作用。

Stack Overflow帖子:阅读有关普通版本与精简版本的区别。

你可以尝试这个jQuery的ajax调用:

$.ajax({
  type: 'GET', // 默认是GET,所以如果你想的话可以省略
  url: '/editnote', // 不要硬编码主机地址
  dataType: 'html',
  success: function(data) {
    console.log(data);
  },
  error: function(e) {
    console.log(e);
  }
});
英文:

> It seems jQuery slim build, doesn't support ajax function. So include
> jquery-3.2.1.min.js try, it will work.

SO post: Read about normal vs slim build.

Can you try this jquery ajax call?

$.ajax({
  type: &#39;GET&#39;, // default is GET, so you can exclude if you want
  url : &#39;/editnote&#39;, // don&#39;t hard the host address
  dataType: &#39;html&#39;,
  success: function(data) {
     console.log(data);
  },
  error: function(e){
     console.log(e);
  }
});

huangapple
  • 本文由 发表于 2017年6月15日 02:34:08
  • 转载请务必保留本文链接:https://go.coder-hub.com/44552209.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定