1

我是 Javascript 的新手。jQuery-ajax-php-cooperation 的代码做了一些奇怪的事情。它有效 - 有时。

这就是我想要做的:

  • 在表单中进行一些设置(作品)
  • 按下提交按钮后读取 JSON 文件(有效)
  • 循环JSON项目,提取每个项目的值并形成一个参数字符串(问题在这里:循环不是(总是)在按钮按下功能中执行)
  • 将从每个项目值构建的参数字符串发送到 PHP 文件(如果输入循环则有效)
  • 接收来自 PHP 文件(html-tag)的响应(有效)
  • 使用响应值更新表单元素(尚未实现,实际上显示带有 PHP 响应的警报以用于调试目的)

JSON 文件有效(经过测试)。HTML 页面是有效的 HTML5(已测试)。PHP 脚本工作并返回一个有效的 HTML-Image-Tag(已测试)。

当我按下按钮时,我为调试目的而实施的警报中没有显示来自 PHP 文件的响应。但这有效:

  • 重新加载页面
  • 打开萤火虫
  • 在循环开始处设置断点
  • 向前跳过一个语句
  • 重新加载页面
  • 循环进入,一切正常

我可以关闭 Firebug 并正确执行循环。

javascript代码

<script type="text/javascript">
$(document).ready(function () {
   //click event of submit button
   $('#generator').click(function(){

   // GET variables
   var datafile = "my.json";
   var logo = false;

   // if checkbox is checked
   if( $('#logo').attr('checked')){
      logo = true;
   };

   // read data from json file
   $.getJSON(datafile,function(data){

   //iterate through the data-sets
   for(var i=0; i < data.length; i++) {

    // get the response from server for each data-set
    $.ajax({
       type: 'POST',
       async: false,
       cache:false,
       url: 'myfile.php',
       data: 'param1='+data[i].field1+'&param2='+data[i].field2+'&logo='+logo,
             success: function(response){

              //$('#imgdisplay').html(response);
              // alert only for debugging purposes
              alert(response);}

          }); // end of ajax-call
       };  // end of for-loop
   }  ); // end of getJSON
 }); // end of button.click
 }); // end of document.ready
</script>

(抱歉格式不好)

我使用了 for 循环,无法让 each() 循环正常工作。

这是形式:

<form name="settings">
   <label>Source file</label>
   <select id="datasource" name="datasource">
      <option value="extract">Extract</option> 
      <option value="filter">Filter</option>
   </select><br />
   <label>Logo</label>
   <input type="checkbox" id="logo" name="logo" value="ON"/><br />
   <p>&nbsp;</p>
   <input type="submit" value="Start Generator" id="generator" name="generator" />
</form>
<div id="imgdisplay" class="imgdisplay"></div>

是什么导致了这种奇怪的行为?我该如何解决?

4

1 回答 1

2

尝试从匿名点击方法返回 false

$('#generator').click(function(){
    ....
    return false;
}

这将确保点击不会发布您的表单

于 2012-10-29T17:07:20.057 回答