3

Web サイトの 1 つで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()at the same position は、facebox の外側のテキスト ボックスで正常に機能します。

4

6 に答える 6

2

facebox.js の 254 行目に移動
$.facebox.reveal($(target).clone().show(), klass)を
$.facebox.reveal($(target).show(), klass) に変更します

Facebox は、実際に表示する代わりに、指定した div を複製しています。.val() を呼び出すと、元の div の値が返されますが、変更された div (ユーザーが操作する) は実際には複製された div です。

私は同じ問題を抱えています。それを修正した後、何かが壊れました（faceboxはdivを1回だけロードし、閉じていると何も機能しないようです）

于 2010-10-07T05:10:36.430 に答える
2

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() {
于 2011-04-08T11:32:25.973 に答える
2

次のように、コードを無名関数でラップする必要があります

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

このヘルプの可能性があります

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

問題が解決しない場合はお知らせください

于 2010-09-22T16:26:30.797 に答える
1

昨日から行き詰まってしまいました。私の場合、facebox.jsはリンク番号243で表示されていました-> $ .facebox.reveal（$（target）.html（）、klass）そして$ .facebox.reveal（$（target）.show（）に変更します、klass）そしてそれは動作します。上記のすべての投稿をありがとう

于 2012-11-01T06:47:51.083 に答える
1

問題は、JavaScript コードが実行されるまでに、ドキュメントがまだロードされていないことです。$('.add-tag-form') を実行するまでに、jquery はクエリに一致する要素を探しても見つからないため、何も起こりません。

これを修正するには、Avinash が言うように、ドキュメントの準備ができたらコードを実行するよう jQuery に指示します。私は通常これを行います：

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

もう1つ、安全のために、次のように関数をラップしてjqueryで呼び出すことも好きです。

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

このようにして、誰かが $ 名をオーバーライドした場合でも、スクリプトは引き続き機能し、$ ショートカットを引き続き使用できます。

于 2010-09-22T16:33:22.853 に答える
0

最後に、facebox フォーム送信の問題を解決するために facebox の代わりに lightbox を使用したこの投稿を更新したいと思います。最初の試行で機能しました。light box にはいくつかのオプションがあり、facbox よりも優れた出力が得られます

于 2013-05-08T07:27:02.483 に答える