Question

我正在构建一个网页，打开一个jquery-ui对话框，其中的表单中填充了一些来自AJAx调用的数据。其中一个数字用于绘制拉斐尔颜色填充的矩形。操作订单是

ajax call
使用DOM调用填写表单
画Raphaeljs的身材
显示jquery-ui对话框

这是代码：

function onSelect_manuale(feature) {
  if (window.XMLHttpRequest){ // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp2=new XMLHttpRequest();
  }
  else{ // code for IE6, IE5
    xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp2.onreadystatechange=function(){
    if (xmlhttp2.readyState==4 && xmlhttp2.status==200){
      obj = jQuery.parseJSON(xmlhttp2.responseText);

      document.getElementById("valMed").value = obj.valMed;
      disegnaBarraCampo(obj.valMed, 'raphaelImageDiv');
      $( "#dialog-manuale" ).dialog('open');

    }
  }
  xmlhttp2.open("GET","jGetData_manuale.php?id="+feature.data.idMisura,true);
  xmlhttp2.send();
}

和

function disegnaBarraCampo(field_value, target_field) {
  document.getElementById(target_field).innerHTML = '';
  var paper = Raphael(target_field, 300, 100);

  var barrettaVerde = paper.rect(field_value, 10, 100, 100, 4);
  barrettaVerde.attr({
    fill:'#00ff00',
    'stroke-width':0
  });
}

使用Firefox或Chrome，一切都很完美。 IE8无法正确渲染Raphael图形：它显示没有颜色填充的矩形和1px黑色边框。

如果我把代码放在对话框之外，同样的Raphael代码在IE8中正确渲染图形，所以我认为这是Raphael + iquery-ui对话框的一个问题。

任何提示？

感谢

阿尔贝托

Answer 1

这是解决方案！

在 jquery-ui-dialog打开后执行Raphael绘图代码。

ajax call

使用DOM调用填写表单

显示jquery-ui-dialog

画拉斐尔人物

IE8无法在jquery-ui对话框中正确呈现Raphaeljs图像

1 个答案: