jquery - Jquery：.preventDefault（）およびfalseを返すは機能しません

Question

今回はコードが私を夢中にさせます

e.preventDefault（）を使用して2週間以上費やし、onclick hrefがページの上部に表示されないようにflaseを返しましたが、機能しませんでした

ウィンドウを上にスクロールするのを止めて使用javascript:void(0)しましたが、入力フィールドが生成されません。

私のコードでこれらのソリューションを使用することに問題があると確信しています。私のコードでこれらの2つのメソッドを使用することに問題がある場合は、教えてください

私のコード：

PHPとjqueryを使用してウィザードを構築しようとしています

このウィザードのステップ2で、ユーザーがクリックしたときに入力フィールドを動的に生成したい

<h2><a href="#" id="addScnt">Add Another Input Box</a></h2>

これはJavascriptです

$(document).ready(function(){
/*****************************/




$('#table_name_error').hide();






  // all content starts hidden
 $('.wizardcontent').hide();
    $('#wizardcontent').hide();
  // initialize the wizard state
  load_state(1);

  // loads new state based on button clicked
  $(':button').click(function(){
        //reset the wizardcontent to hidden
        //$('#wizardcontent').hide();
        //load_state(++current_state);
    var current_state = $('#wizard').attr('class');
    //we only want the number, converted to an int
    current_state = parseInt(current_state.replace(/(step_)/, ""));
        //figure out if 'next' or 'previous' was clicked and load appropriate state
    if ($(this).attr('id') == 'next'){ 
    switch(current_state){
        case 1:

        $('#wizardcontent').hide();
            load_state(++current_state);
        break;

        case 2:
            var scntDiv = $('#p_scents');
        var i = $('#p_scents p').size() + 1;

        $('#addScnt').on('click', function() {
                $('<p><label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt_' + i +'" value="" placeholder="Input Value" /></label> <a href="#" id="remScnt">Remove</a></p>').appendTo(scntDiv);
                i++;
                return false;
        });

        $('#remScnt').on('click', function() { 
                if( i > 2 ) {
                        $(this).parents('p').remove();
                        i--;
                }
                return false;
        });

        var table_name=$('#table1').val();
        table_name=$.trim(table_name);
            if (table_name.length<3 || table_name.length>64){
            $('#table_name_error').show();
            $('#table_name_error').html("<p>Error: Minimum length for table name is 3 <br/>Maximum length for table name is 64 characters</p>");
            }else{

            $('#wizardcontent').hide();
            load_state(++current_state);
            }

        break;
        case 3:


        $('#wizardcontent').hide();
            load_state(++current_state);
            break;

        }

     }
    else if ($(this).attr('id') == 'previous'){ load_state(--current_state); }

  });

/**************************/



});

function load_state(current_state){
    //disable all buttons while loading the state
    $('#previous').attr("disabled","disabled");
    $('#next').attr("disabled","disabled");
    $('#save').hide();
  //load the content for this state into the wizard content div and fade in
  var content = $('#step_' + current_state).html();
  $('#wizardcontent').html(content);
    $('#wizardcontent').fadeIn("slow");
  //set the wizard class to current state for next iteration
  $('#wizard').attr('class','step_'+ current_state);
  var iterator = 1;
  // the state heading h3. removing is no biggie
  $('#wizard h3').text("Step " + current_state);
  // loop through the list items and set classes for css coloring
  $('#mainNav li').each(function(){
        var step = $(this)
    if (iterator == current_state){ step.attr('class','current'); }
    else if (current_state - iterator == 1){ step.attr('class','lastDone'); }
    else if (current_state - iterator > 1){ step.attr('class','done'); }
    else{ step.attr('class',''); }
        // special case for step 5 because it doesn't have bacground image
        if (iterator == 3){ step.addClass('mainNavNoBg'); }
    iterator++;
  });
    //depending on the state, enable the correct buttons
    switch(current_state){
        case 1:
        $('#next').show();
                $('#next').removeAttr("disabled");
        $('#previous').hide();
            break;

        case 3:
        $('#previous').show();
            $('#previous').removeAttr("disabled");
            $('#next').hide();
            $('#save').show();
            break;
        default:
        $('#save').show();
        $('#previous').show();
        $('#next').show();

            $('#previous').removeAttr("disabled");
            $('#next').removeAttr("disabled");
            break;

    }
}

これはhtmlコードです

<fieldset class="wizardcontent" id="step_2">
                  <b>Type name of the first table:</b><br/>

                  <input type='text' id='table1' name='table1'/>
                  <div id='table_name_error' name='table_name_error' class='error'></div>
                  <br/><br/>

                  <b>Identify table attributes, along with the basic type:</b><br/>
                    <h2><a href="#" id="addScnt">Add Another Input Box</a></h2>

                    <div id="p_scents">
                        <p>
                            <label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt" value="" placeholder="Input Value" /></label>
                        </p>
                    </div></fieldset>

score 6 · Accepted Answer

.preventDefault();

私はあなたのコードを見つけることができませんでしpreventDefault();たが、それはおそらくあなたのタイトルのようなタイプミスです.いくつかの確認事項があります.

イベント変数があることを確認してください。

$('a').click(function(event) {
    // `event` is the event variable
});

次に、次を使用します。

event.preventDefault();

したがって、完全に：

$('a').click(function(event) {
    event.preventDefault();
});

上記のコードは、すべてのアンカーが指定されたハイパーリンクに移動するのを防ぎます。

false を返します。

return false;以前は結構使っていましたが、.preventDefault()最近はイベント用に移行しています。ここで覚えておくべきことの 1 つは、を含む関数の一部がreturn false;例外をスローした場合、例外に到達しないことです。したがって、防止しようとしているイベントは関係なく発生します。

score 2 · Accepted Answer

$('.class').click(function() {

// Do what ever here

return false;

});

これは私にとってはうまくいきます。

jquery - Jquery：.preventDefault（）およびfalseを返すは機能しません

3 に答える 3

Related

Reference