Jquery jqmodal ajax 支持

Question

我正在网站上使用模式，但我无法实现某些目标： 我使用的模式是 jqModal 在这里找到： http://dev.iceburg.net/jquery/jqModal/

我在初始化一个模式时没有任何问题。

<script type="text/javascript">$().ready(function() {
$('#cartdialog').jqm({ajax:'@href',trigger: 'a.jqModalcart'});
});</script>


<a class="jqModalcart" href="/ash/shop/cart2.php"><img src="/ash/images/viewcart.gif" 
alt="viewcart"/></a>

这将加载我的主模式，其中显示 cart2.php 的内容。

这就是问题所在，我知道可能有多种解决方案。 cart2.php 上有一个按钮，我希望用户单击该按钮并让模式从不同页面（shipping.php）加载新内容。最好将 cart2.php 替换为 Shipping.php，而不需要打开和关闭模态，或与当前模态重叠的嵌套模态。

让事情变得更加复杂的是，shipping.php 需要加载邮政编码，我为此编写了一个简单的 javascript 验证器。需要传递的链接看起来像这样：

href=("/ash/shop/shipping.php?zip=" + document.form9.zip.value)

我知道我可以通过像这样初始化它来将该链接获取到模态中：

<script type="text/javascript">$().ready(function() {
$('#idhere').jqm({ajax:'@href',trigger: 'a.classhere'});
});</script>

但是，我似乎无法从模态“触发”模态。

所以我有很多问题： 1）我可以保留一个模态并更改其中通过 AJAX 加载的内容（基本上是在一个模态窗口内的页面之间导航）吗？理想的解决方案！！！ 2）如果没有...我如何创建一个嵌套模式，该模式将显示在主模式的顶部并加载上面的链接，该链接需要来自我的邮政编码验证器的信息（我可以提供ajax：'linkhere'），但我的链接有这部分添加到验证器“+ document.form9.zip.value”内的末尾 3）如果这是不可能的...我怎样才能使主模式上的按钮首先关闭主模式然后使用包含链接+zip的新内容加载辅助模式

我试图以最清晰的方式提供这一点把它从我的脑子里赶出去。我很乐意回答有关此问题的任何问题，因为我完全理解我可能还没有完全清楚

更多信息...我尝试过 .load() 但没有成功，但这很可能是因为我在这方面的技能很少。这是我的邮政编码脚本。我这样做是为了在输入 5 个字符后，链接会发生变化，以便用户首先看到“输入邮政编码”，然后看到“计算运费”，并且 href 也会发生变化。

<script language="javascript">

function movepic(img_name,img_src) {
document[img_name].src=img_src;
}
</script>

<script language="javascript" type="text/javascript">
function limitText(limitField, limitCount, limitNum) {
if (limitField.value.length == limitNum) {
    limitField.value = limitField.value.substring(0, limitNum);

    //switch image out
    javascript:movepic('button','/ash/images/calculateshipping.gif');

    //change image link
    document.getElementById("tester").href=("/ash/shop/shipping.php?zip=" + document.form9.zip.value);
    document.getElementById("tester").onclick=function(){$('#cartdialog').load("/ash/shop/shipping.php?zip=" + document.form9.zip.value);};

} else {
    limitCount.value = limitNum - limitField.value.length;
}
}
</script>

我的 HTML 有一个表单...

<form id="form9" name="form9" method="post" action="">
<a id="tester" name="tester" class="jqModalship" href="#" style="margin-right:4px;"><img name="button" src="/ash/images/enterzipcode.gif" alt="Image"></a>
<input name="zip" type="text" size="5" onKeyDown="limitText(this.form.zip,this.form.countdown,5);" 
onKeyUp="limitText(this.form.zip,this.form.countdown,5);" maxlength="5">
</form>

为什么我无法使用上面的方法将新页面加载到模式中？

Answer 1

要更改模态框的内容，您可以使用 .load() 来更新模态框的 div。

或者，您可以使用 iframe 功能（请参阅 http://dev.iceburg.net/jquery/ 中的#7 jqModal/）。这将允许您提到的“在模态内部导航”。

第二个选项可能需要加载第二个模态的侦听器，因为我不确定 jqModal 是否允许延迟加载（在初始化后处理注入到 DOM 的代码...如 .live()）。

第三个选项是黑客祈祷版本。它会起作用，但你不想使用这个。