Question

我在我的某个网站上使用Facebox（http://defunkt.github.com/facebox/）。我也在网站上广泛使用jQuery。

我的问题是.val（）函数似乎在facebox中不起作用。现在，这是显示为facebox的DIV：

<div id="edit-tags" style="display: none;">
  <script type="text/javascript">   
   $('.add-tag-form').submit(function(){
    alert($('input.tags-input').val());
    return false;
   });
  </script>

  <form class="add-tag-form">
   <input type="text" name="tags-input" class="tags-input" />
   <input type="submit" class="small-button" value="Add Tag" />
  <form>
</div>

现在，问题是input.tags-input的值未显示在警告框中。它显示为空。

为了使问题变得更糟，jQuery选择实际上是有效的。也就是说，$('input.tags-input').hide()完全正常。

为了使问题更严重，.val()使用初始值。也就是说，如果我使用它：

<input type="text" name="tags-input" class="tags-input" value="Some value" />

然后，警告框显示“Some Value”，无论我是否更改了值。

我完全被困在这里。代码中相同位置的.val()可以正常使用facebox外的文本框。

Answer 1

您需要将代码包装在匿名函数中，例如

$(function() { ... });
       or
$(document).ready(function() { ... });

可能是这个帮助的

$(function() {
   $('.add-tag-form').submit(function(){
      alert($('input.tags-input').val());
      return false;
   });
});

如果问题仍然存在，请告诉我

Answer 2

转到facebox.js第254行更改
$。facebox.reveal（$（target）.clone（）。show（），klass）到
$。facebox.reveal（$（target）.show（），klass）

Facebox正在克隆您提供的div而不是实际显示它。当你调用.val（）时，它将返回原始div的值，但修改后的div（用户与之交互）实际上是一个克隆的div。

我遇到了同样的问题。在我修复之后，其他东西破了（facebox只会加载div一次，当它关闭时似乎没什么用）

Answer 3

正如Ngo Minh Nam指出的，facebox   将克隆原始   div，所以你正在阅读最初的   输入字段的值。

这是我（丑陋）的解决方法   事情有效：
$('#input_field_id').live('keyup', function() {
  $('#input_field_id').val($(this).val());
});
这将更新输入字段每次钥匙在里面压下来价值框。

更新：忘了！只需在要阅读的元素的id之前附加#facebox即可。在我的例子中：

$('#facebox #input_field_id').val();

请注意，您必须将这些行包装在

中

    $(document).bind('reveal.facebox', function() {

Answer 4

问题是，当您的javascript代码运行时，文档尚未加载。当你运行$（'。add-tag-form'）时，jquery看起来并且没有找到任何与查询匹配的元素，因此没有任何反应。

要解决此问题，请按照Avinash的说法进行操作，并告诉jQuery在文档准备好后运行代码。我通常这样做：

$(document).ready(function(){
    ...
});

另一件事，为了安全起见我也喜欢用jquery包装我的函数并调用它们，如下所示：

(function ($){
   $(document).ready(function() {
       ...
   });
})(jQuery);

这样，如果有人覆盖$ name，脚本仍然有效，我仍然可以使用$快捷方式。

Answer 5

我被困在最后一天。在我的情况下，facebox.js显示在链接no 243-＆gt; $ .facebox.reveal（$（target）.html（），klass）并将其更改为 $ .facebox.reveal（$（target）.show（），klass）它的工作原理。感谢以上所有帖子

Answer 6

最后我想更新这篇帖子，我已经使用了lightbox而不是facebox来摆脱我的facebox表单提交问题，并且它在第一次尝试时工作。灯箱有更多选项，并且输出比facbox更好

jQuery的.val（）无法在Facebox中运行

6 个答案: