Jquery函数未正确创建新标记

Jquery Function not correctly creating new markers

本文关键字：创建 新标记 函数 Jquery      更新时间：2023-09-26

我必须承认（可能从我之前的问题中可以看出）我对Jquery相对陌生。我知道一点Java，但我的知识主要在于CSS和HTML4/5。我正在做一个项目，我需要能够在地图上创建、移动和删除标记。我没有使用谷歌的api地图，而是将其自由形式化，这样任何计划都可以在理论上发挥作用。然而，到目前为止我遇到的问题是，我的一个朋友在完成他的项目后把代码借给了我。。。我不完全理解我看到的一些东西，我通常会问他，但他正在巡游（他真的把手机也忘在家里了，所以没人会打扰他）。

在第9行，我不理解这个函数抓取器，它是抓取页面html还是位于页面上的函数？如果它确实从页面中获取数据，这是否意味着我必须重新创建该函数？主要的问题是，当我单击标记按钮创建一个新的标记时，它会锁定我的光标，但不允许我实际放置标记（就像事件没有被正确调用一样）。

此外，底部的json位。。。我认为json是一种独立的语言？

function newIssue(e)
  {
     var pos = $('#plan').offset();
     var x = e.pageX - pos.left;
     var y = e.pageY - pos.top;
     var u = x/$('#plan').width();
     var v = y/$('#plan').height();
 $.get('/new/newIssue/14/' + u + '/' + v + '/' + e.data.kind + '/', function(data)
     {
        var x = eval(data);
        var num = x.number;
        Issue.push({id: num, u: u, v: v, repaired: false, kind: e.data.kind, timestamp: x.timestamp, detailed: true});
        var n = insertIntoCluster(Issue[Issue.length - 1], Cluster, 10);
        reclusterOnAddition(n);
        if (e.data.kind == 'Repairable')
           openIssue(num, true);
        $('#plan-wrapper').css('cursor', 'move');
        $('#plan').unbind('mousedown');
        $("div[id^='m']").show();
        panner.enable();
     }, 'json');
  }

<li><a href="javascript:prepNewIssue('Repairable')">Repairable</a></li>

我因为这样做而受到抨击，但我朋友的代码运行良好，我能够更好地理解这种方式。基本上，你点击链接，当你再次点击时，它会到达你的光标所在的位置，创建一个标记，但它会启用光标，但当你再次单击时，没有创建任何东西，只是停留在"创建"的循环中，没有创建。

首先是Javascript:Java:：Carpet：Car。

Javascript是而不是Java。事实上，从现在开始，我将用它的正式名称ECMAScript来称呼它。

您在这里问了几个问题，但您一开始说您不理解第9行的代码在做什么。

在ECMAScript中，可以将一个函数作为参数传递给另一个函数。

$.get从服务器获取数据。参数function(data) { ... }告诉ECMAScript在检索数据时要做什么。请记住，此块中的其他代码将继续执行，并且在调用代码完成之前，将不会执行作为参数传递的函数。（Google:javascript事件循环）。

最后，大括号和逗号后面的'json'字符串是$.get函数的另一个参数。它告诉$.get它正在处理什么类型的数据，以便对其进行适当的处理。

 $.get('/new/newIssue/14/' + u + '/' + v + '/' + e.data.kind + '/', function(data)
     {
        var x = eval(data);
        var num = x.number;
        Issue.push({id: num, u: u, v: v, repaired: false, kind: e.data.kind, timestamp: x.timestamp, detailed: true});
        var n = insertIntoCluster(Issue[Issue.length - 1], Cluster, 10);
        reclusterOnAddition(n);
        if (e.data.kind == 'Repairable')
           openIssue(num, true);
        $('#plan-wrapper').css('cursor', 'move');
        $('#plan').unbind('mousedown');
        $("div[id^='m']").show();
        panner.enable();
     }, 'json');

至于您关于JSON是一种完全不同的语言的问题，这是不正确的。JSON是"JavaScript对象表示法"的缩写。它是将数据表示为Javascript（ECMAScript）代码的一种方式。严格来说，它是ECMAScript语言的一个子集。

以下是一些JSON表示汽车信息的示例：

{
    Year: 2013,
    Make: "Acura",
    Model: "TL",
    IsInService: true
    Drivers: [{
        FName: "Bob",
        LName: "Smith"
    }, {
        FName: "Sue",
        LName: "Smith"
    }]
}

更新：我知道这个答案有点长，但我将以一种可能帮助您更好地理解正在发生的事情的方式重构此代码：

function newIssue(e)
  {
     var pos = $('#plan').offset();
     var x = e.pageX - pos.left;
     var y = e.pageY - pos.top;
     var u = x/$('#plan').width();
     var v = y/$('#plan').height();
     var ajaxTarget = '/new/newIssue/14/' + u + '/' + v + '/' + e.data.kind + '/';
     var callbackFunction = function(data)
     {
        var x = eval(data);
        var num = x.number;
        Issue.push({id: num, u: u, v: v, repaired: false, kind: e.data.kind, timestamp: x.timestamp, detailed: true});
        var n = insertIntoCluster(Issue[Issue.length - 1], Cluster, 10);
        reclusterOnAddition(n);
        if (e.data.kind == 'Repairable')
           openIssue(num, true);
        $('#plan-wrapper').css('cursor', 'move');
        $('#plan').unbind('mousedown');
        $("div[id^='m']").show();
        panner.enable();
     };
     // Call $.get with three parameters,
     // ajaxTarget: tells $.get where to get data from.
     // callbackFunction: tells $.get what to do with the data.
     // 'json': tells $.get that we are getting json data.
     $.get(ajaxTarget, callbackFunction, 'json');
  }

这个问题很难理解，我在第9行看不到函数grabber。第9行执行jQuery的$.get方法，该方法执行AJAX请求。

这个请求指定它期望返回json，这意味着传递给回调函数（data）的参数包含一些json格式的数据。（顺便说一句，JSON不是一种独立的语言，它只是一个Javascript）。

相关文章：