0

ですから、私が抱えている問題は、検証などを使用してフォームを作成するという長い話ですが、特別なことは何もありませんが、[送信]ボタンをクリックすると、私が一生できないことがいくつか起こっています。どうして。

もともと、この単純な送信ボタンのhtml部分は次のとおりです。

   <input type="submit" id="submit" value="Submit"/>

そのボタンをクリックすると、これらのいずれかが発生します。

  1. ボタンが非常に小さくなり、舞台裏（firebugなど）でその中の単語が消え、firebugチェックでコードは次のようになります

    <input type="submit" id="submit" value>

そのフォーム要素プロパティの値部分を完全に取り除きます。

また

2.送信ボタンの「値」がエラーメッセージの1つになります。たとえば、次のようなものが表示されます

<input type="submit" id="submit" value="oops, you forgot something"/>

これは、ユーザーがフィールドに入力するのを忘れたときのエラーメッセージの1つです。

また

  1. Firefoxでは、新しいページのロード/リロードでも、そのボタンを右クリックし、右クリックして[ソースの表示]または[Fbugで検査]を選択すると、ボタンが緑色になります.......同じパラメータが適切に満たされている場合にフィールドが取得する緑色。

これらは非常に奇妙なので、私はこれをいじるのをやめました。誰かがこれを理解するのを手伝ってくれることを願っています。これまでのところ、それはやっかいです。笑

これがjsです：

<script>



$('document').ready(function(e) {

//FORM VARS 
var firstName = $('#form-name');
var formEmail = $('#form-email');
var formSbj = $('#form-subj');
var formMssg = $('#form-mssg');
var mainF = $('#spForm');
var box = $("#box");
var addem = $('#addem');
var addemR = 8;
var formSubBtn = $('#submit');
var formFields = $('#spForm :input');


//FORM ERROR MESSAGES
var error_MK = 'oops, you forgot something';
var error_isntAnum = 'answer must be numerical please';
var error_numAddition = 'So whats 5 + 3 again???';
var finalCheck = false;
var pageErrorDiv = $('#gen_error');


//this one fires on click
function clearField(){
    if($(this).val() == this.defaultValue || $(this).val() == error_MK || $(this).val() == error_isntAnum || 
    $(this).val() == error_numAddition){
        this.value = '';
        //use this as a workaround for the disappearing "submit" text -->   formSubBtn.val('Submit');
    }
}
//this one fires on blur
function checkVals(){
    if($(this).val()==""){
        $(this).css("background-color","red");
        $(this).css("color","white");   
        $(this).val(error_MK);//error mssg

    } else {
        $(this).css("background-color","green");
        $(this).css("color","white");   
    }



}





//this one checks to see if the person can add lol...make sure its not a SPAM robot.
function checkAddem(){
    if(addem.val()== 'oops, you forgot something' || addem.val()=='AND THE TOTAL IS?'){
        addem.css('background-color','red');
        addem.css('color','white');
        addem.val(error_MK);    //error mssg
    } else if(isNaN(addem.val())){
        addem.css('background-color','red');
        addem.css('color','white');
        addem.val(error_isntAnum);//error mssg  
    } else if(addem.val() != addemR){
        addem.css('background-color','red');
        addem.css('color','white');
        addem.val(error_numAddition);//error mssg   
    }
}


formFields.click(clearField);
formFields.blur(checkVals);
addem.blur( checkAddem );


//FINAL CHECK b4 form submittal.
formSubBtn.bind('click', function(){

    //on click double check all fields
    if( firstName.val()=="" || firstName.val()=="ENTER YOUR NAME HERE" ||  firstName.val()== error_MK ||
    formEmail.val()=="" || formEmail.val()== error_MK || formEmail.val()=="ENTER YOUR EMAIL HERE" ||
    formSbj.val()=="" || formSbj.val()== error_MK || formSbj.val()=="SO WHAT DO YOU WANT TO CHAT ABOUT?" ||
    formMssg.val()=="" || formMssg.val()== error_MK || formMssg.val()=="ENTER YOUR MESSAGE HERE" ||
    addem.val() != addemR){
        pageErrorDiv.text("Information entered either no good or blah blah blah");
        return false;
    }else{

        return true;    
    }


});






});
</script>

ああ、Ps; 何が起こっているかを見ることができるので、ここに私のテストリンクがあります。

http://somdowprod.net/4testing/spFormDev/spContForm

4

2 に答える 2

3

送信ボタンが検証されているようです。これは、入力の1つとして選択しているため意味があります。それ以外の

var formFields = $('#spForm :input');

これを試して：

var formFields = $('#spForm :input').not('#submit');
于 2012-05-30T01:57:50.383 に答える
2

一目見ただけですが、これは何か関係があるのでしょうか？

formFields.blur(checkVals);

formFieldsには送信ボタンが含まれていると思いますが、クリックしても送信ボタンは値を返さないため、次のようなcheckVals関数が登録されます。

$(this).val(error_MK);//error mssg

そのため、エラーメッセージが表示される可能性がありますoops, you forgot something。

ちょうど私の2セント...

于 2012-05-30T02:01:41.597 に答える