2

最近、従来の登録からアップグレードしました

element.property = function

を使った事前登録へ

element.addEventListener( "property", function,  bool );

関数では、ユーザーが次のようにエンターキーを押したときにフォーム送信を無効にするために false を返しました。

tweet_input.addEventListener( "keypress", function( event )
{ 
    if( event.keyCode === 13 )
    {
       new ModelTweet().invoke(); 
       return false;
    }
}, false );

ただし、これは機能しなくなり、ユーザーが Enter キーを押すたびにフォームが送信されます。

HTML は次のようになります。

  <form id="tweet" method="post" name="tweet">
    <div id="tweet_input_wrap">
      <input id="tweet_input" name="tweet" type="text" maxlength="40">
        <p id="tweet_label">Comment
        </p>
      </input>
    </div>
    <p id="tweet_button" href="javascript:void(0)">Share
    </p>
    <div id="tweet_response" class="response">
    </div>
    <div id="tweet_fill">
      <!--TWEET FILL 
      -->
    </div>
  </form>

このメソッドを他の 3 つのフォームで使用していますが、問題なく動作します。

事前登録への更新は、私が行った最後の大きな変更でしたが、他の 3 つのフォームは問題なく機能しているため、何が問題なのかわかりません。

コードを動作する他の 3 つの形式と比較しても、違いはわかりません。

私も最近ツイートのモデルを更新しましたが、フォームが 2 回送信されていることは明らかです。

奇数。

/**
 *ModelTweet
 */

var ModelTweet = ( function() 
{
    var ModelTweetI = function ( )
    {
        this.form_elements = document.getElementById( 'tweet' ).elements, 
        this.response_element = document.getElementById( 'tweet_response' );
        this.fill_element = document.getElementById( 'tweet_fill' );

        this.text_object = new TextValidator( this.form_elements );
        this.message_object = new Message( this.response_element );
        this.effects_object= new Effects( this.response_element );

        this.ajax_object = new AjaxRequest();
        this.shared_object = new Shared();

        this.TIME = this.shared_object.get( 'TIME' );
        this.load_on = this.shared_object.get( 'load_on' );
    };
    ModelTweetI.prototype.invoke = function( ) 
    {
        if( this.load_on === 1 )
        {
            if( !this.text_object.checkEmpty() ) 
            {
                this.message_object.display( 'empty' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
            if( !this.text_object.checkPattern( 'tweet' ) ) 
            {
                this.message_object.display( 'tweet' );
                this.effects_object.fade( 'down', this.TIME );
                return false;
            }
        }
        var response_element = this.response_element;
        var fill_element = this.fill_element;
        this.ajax_object.invoke( this.ajax_object.serializeArray( this.form_elements ) + '&ajax_type=tweet_control', function( server_response_text ) { new AjaxResponse( server_response_text, 'tweet', response_element, fill_element ); } );
        var tweet_input = document.getElementById( 'tweet_input' );
            tweet_input.value='';
            tweet_input.blur();
        }
    };
    return ModelTweetI;
} ) ();
4

1 に答える 1

4

イベント ハンドラーの戻り値は、一緒に使用しても何もしないaddEventListener()ため、false を返すことは、意図したことを実行するようには設計されていません。

デフォルトの動作を防ぎたい場合は、次のように呼び出す必要がありますevent.preventDefault()(場合によってはそれevent.stopPropagation()も):

tweet_input.addEventListener( "keypress", function( event )
{ 
    if( event.keyCode === 13 )
    {
       new ModelTweet().invoke(); 
       event.preventDefault();
    }
}, false );

addEventListener注: この構文は、 orをサポートしていない古いバージョンの IE では機能しませんevent.preventDefault()。彼らは と を使って物事を行う独自の方法を持っていattachEventますwindow.event.returnValue = false;。

于 2012-05-18T16:43:34.543 に答える