Question

要求是读取Json对象，并且应该在工具提示上的鼠标上显示该值。请在http://jsfiddle.net/8WKTj/49/

中找到代码

以下是JSON代码：

jsonDataFile.js

{ 
  "Column1": "This represents transID",
  "Column2": "This represents Spread percentage",
  "Column3": :" Column3 title description";
}

的javascript：

$(function()
        {
           $(".question").each(function(index)
            {
              $.getJSON("js/jsonDataFile.js",function(result){
                  $.each(result, function(i, field){
                      alert(" i: " + i +" ,"+ field); //prints i: column1 ,This represents transID 
                                  //i: column2 , This represents Spread percentage
                      $(this).prop('title', result[index]);
                  });
              });

            });
        });

当我将鼠标悬停在column1上时，工具提示应显示消息“This represent transID”。类似地，当鼠标覆盖column2时，工具提示应显示“This表示传播百分比”...我已尝试读取json文件并在工具提示上显示消息，但输出不符合预期。它没有显示任何东西。请建议。

Answer 1

1）为什么你在为每个问题从网络读取SINGLE（！）静态JSON？从JSON中反转逻辑和BIND QUESTIONS，而不是BIND JSON TO QUESTIONS，这是正确的，特别是因为getJSON本质上是异步而不是$（..）。每个

2）永远不要使用alert（） - 它锁定JS的主线程并且是用于调试的真正的crasher - 使用console.log或console.debug来打印调试信息（！） - 看到这样的消息U应该启动嵌入式浏览器控制台或类似FireBug的东西

3）将逻辑拆分为可读函数，例如applyQuestion（element，resultItem）{}

4）变量中的缓存数组

所以这里是具有正常逻辑的伪代码（应该是这样的）

$(function(){
    var applyQuestion = function(e, result){/* 
    here logic to setup element with item
    and as a part of it - you can setup "mouseoverevent" with some things from result
    */};
    var questionElements = $(".question");
    $.getJSON(url, function(result){
        questionElements.each(
            function(e){ applyQuestion(e,result);}
        )
    });

})();

所以它非常清楚并且可以翻译成人类语言＆＃34;在开始时，加载json文件并且当它加载时通过标准绑定函数将其存储到目标元素中＃34;

阅读json并显示动态值onmouse over

1 个答案: