Question

我遇到了Prototype Draggable窗口的问题.. 我有一个窗口，我想在窗口内启动一些jQuery / Ajax / JavaScript函数，但似乎没什么用。

看一个我用简单的JavaScript弹出脚本制作的例子，当我点击它没有显示的div时，我所做的每一个功能都会发生同样的事情。

<script type="text/javascript">
    function show_confirm() {
        var r = confirm("Press a button!");
        if (r == true) {
            alert("You pressed OK!");
        } else {
            alert("You pressed Cancel!");
        }
    }
</script>

<a href="#" onclick="show_confirm()"><div id="delete"></div></a>

对于jQuery我已经尝试过noconflict()但它仍然无效。

编辑：以下是我设置窗口的方法：

function openApps() {
  new UI.Window({theme: "ultra_dark",
          width:  1170, 
               height: 630,
               superflousEffects: superflousEffects}).center().show().setAjaxContent('myFile.php', {
    method: "GET", 
    onCreate: function() { 
    this.header.update("Applications");   
      this.setContent('<div class="message">Please wait...</div><div class="spinner"></div>');   
    }
  });  
     }

Answer 1

为什么不使用jQuery's UI？内置dialogue windows可防止任何冲突。

以下是在您的上下文中使用它的示例：

<script>
$(function() {
    $( "a[id=delete-item]" ).click(function(){
        $( "div[id=dialog-confirm-delete]" ).dialog({
            modal: true,
            buttons: {
                "Delete item": function() {
                    $( this ).dialog( "close" );
                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
});
</script>
<style>
    div[id=dialog-confirm-delete] {
        display: none;
    }
</style>
<div id="dialog-confirm-delete">
    <p>
        This item will be permanently deleted and cannot be recovered. Are you sure?
    </p>
</div>
<a id="delete-item">Delete</a>

一个有效的例子：

http://jsfiddle.net/xsv8B/2/

Answer 2

因为它是通过AJAX设置内容，所以您的脚本正在context of a callback中执行。函数show_confirm可能成为onComplete中的闭包 - 你不需要写的东西，它是自动的。

您可能需要明确地将其分配给全局变量。

window.show_confirm = function() {
    var r = confirm("Press a button!");
    if (r == true) {
        alert("You pressed OK!");
    } else {
        alert("You pressed Cancel!");
    }
}

或者，如果您发现检索到的<script>元素根本没有被执行（我认为这可能会出现一些域问题），那么您可以使用iframe代替setAjaxContent('myFile.php', ...)替换为{{1} }}。这是一个妥协，因为我没有看到如何有一个加载微调器。

Answer 3

试试这个

<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button!");
if (r)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }

return false;
}

//if you want to use jquery
$(function(){
   $("a").click(function(){
      var r=confirm("Press a button!");
      if (r)
      {
        alert("You pressed OK!");
      }
      else
      {
        alert("You pressed Cancel!");
      }

      return false;
   });
});
</script>



<a href="#" onclick="return show_confirm()"><div id="delete"></div></a>

在原型中运行JS / JQuery

3 个答案: