1

我正在使用出色的jcrop 插件来实现图像裁剪。

但是,有一个问题。我希望用户选择一个区域,然后看到一个对话框。当他们在对话框中输入内容并单击“确定”时,我希望他们返回到未选择任何内容的图像。

这是我的代码:

jQuery(window).load(function(){
    var jcrop_api = $.Jcrop('#cropbox',{
        boxWidth: 1400,
        onSelect: showAlert
    });
});
function showAlert(c)
{
    var structidx = prompt("Enter number here: ", "");
    if (structidx!=null && structidx!="") {
                // TODO: some handling here
        alert("Entry has been saved");
        jcrop_api.release();
    } else {
        jcrop_api.release();            
    }
};

但是,这样,当用户在提示上单击“确定”或“取消”时,他们会返回到仍在积极“选择”的图像。当他们移动鼠标时,它会继续选择 - 他们无法选择新区域。感觉坏了。

我认为这是一个 javascript 流程问题 -showAlert正在退出并将我返回到浏览器的先前状态,即选择了一个区域 - 但我不知道如何解决它。

谢谢!

4

2 回答 2

0

您不能以这种方式获取 API。尝试这个:

$(window).load(function(){
  var jcrop_api = $.Jcrop('#cropbox',{...});
});

jcrop_api另请注意,如果它们引用它,您需要在与变量相同的范围内声明您的回调函数。在您的示例代码中并非如此。

于 2011-01-12T01:31:04.700 回答
0

尝试这个:

jQuery(window).load(function () {
  // function definition first
  function showAlert(c) {
    var structidx = prompt("Enter number here: ", "");
    if (structidx!=null && structidx!="") {
      // TODO: some handling here
      alert("Entry has been saved");
    }
    jcrop_api.release();
  }

  // make a global variable by leaving off the "var" keyword
  jcrop_api = $.Jcrop('#cropbox',{
    boxWidth: 1400,
    onSelect: showAlert
  });
});
于 2011-01-12T12:04:00.900 回答