您需要使用 PreventDefault() 来防止浏览器简单地跟踪链接,并且您将操作放入表单的提交事件中,但是您没有提交按钮,并且没有触发提交事件,因此该事件从不火灾。在这种情况下,您不需要提交表单,因此您可以简单地利用链接单击事件,使用表单中输入的数据打开 iframe。像这样
<script>
$(document).ready(function() {
$("a[rel=zipformSubmit]").click(function(e) {
e.preventDefault();
var zip = $('#zip').val();
alert("about to open colorbox with zipcopde " + zip);
$.colorbox({href: "?zip=" + zip, iframe:true, innerWidth:800, innerHeight:600});
});
}); </script>
注意:一些验证会很好if (zip.length > 0) { }
etc
评论后添加:
为了带入您的$_GET['Source']
您应该添加一个隐藏的表单字段:
<div class="form-zip-start">
<p>Enter your zip code to begin your search:</p>
<form id="submit" action="#" name="submit" method="post">
<input type='hidden' name='source' id='source' value='<?php echo $_GET['Source']; ?>' />
<input name="zip" id="zip" type="text" value="" class="zip-start" />
<div class="form-submit"><a href="/form.htm" rel="zipformSubmit" class="zipformSubmit">Submit</a></div>
</form>
</div>
然后制作js:
<script>
$(document).ready(function() {
$("a[rel=zipformSubmit]").click(function(e) {
e.preventDefault();
var zip = $('#zip').val();
var source = $('#source').val();
alert("about to open colorbox with zipcopde " + zip);
$.colorbox({href: "?source="+source+"&zip=" + zip, iframe:true, innerWidth:800, innerHeight:600});
});
}); </script>