0

フォーム内メッセージを表示し、jQuery でフォーム送信を無効にするにはどうすればよいですか?

フィールドに入力する前に、送信する必要があるテキスト入力フィールドに jQuery を使用してインフォーム メッセージを表示し、送信ボタンを無効にしたいと考えています。

私の簡単な質問はこれです：

入力フィールドが空の場合にエラー メッセージを表示し、送信ボタンを無効にしたい。入力フィールドが空の場合、空の入力フィールドの近くにメッセージを表示して、入力する必要があります。

私は試した

$("#CustomerForm").validate({
  rules: {
    FirstNameEdit: { required: true },
    LastNameEdit: { required: true },
    EmailEdit: { required: true, email:true }
  }
});

しかし、うまくいきません。

頭

<script type="text/javascript">
$.fx.speeds._default = 650;
$(function() {
  $('.massgejava').dialog({
    autoOpen: false,
    show: 'explode',
    hide: 'explode',
    title: 'راسلنا',
    width: 380
  });
  $('#javamassge').click(function() {
    $(".massgejava").dialog('open');
    return false;
  });
  $('input#registerjquery').click(function() {
    $(".massgejava").dialog("close");
  });
});
</script>

体

<form action="form.php" method="post">
  <input name="name" 
         type="text" 
         value="اسمك الكريم" 
         onblur="if (this.value == '') this.value = 'اسمك الكريم'" 
         onclick="value=''" />
  <input name="email" 
         type="text" 
         value="البريد الالكتروني" />
  <input name="phone" 
         type="text" 
         value="رقم الهاتف" 
         onblur="if (this.value == '') this.value = 'رقم الهاتف'" 
         onclick="value=''" />
  <textarea name="msg" 
            cols="41" 
            rows="5" 
            placeholder = "نص الرساله" 
            wrap="soft"></textarea>
  <input type="submit" value="ارسال" />
</form>

提案？

4

1 に答える 1

1

ID が追加されたフォーム: 

<form action="form.php" method="post" id="CustomerForm">
    <input name="name" type="text" value="اسمك الكريم" onblur="if (this.value=='')this.value='اسمك الكريم'" onclick="value=''" />
    <br />
    <input name="email" type="text" value="البريد الالكتروني" />
    <br />
    <input name="phone" type="text" value="رقم الهاتف" onblur="if (this.value=='')this.value='رقم الهاتف'" onclick="value=''" />
    <br />
    <textarea name="msg" id="msg" cols="41" rows="5" placeholder="نص الرساله" wrap=soft></textarea>
    <br />
    <input type="submit" id="submit" value="ارسال" />
</form>

JQuery: 

function kontrolaMailu(emailAddress) {
    var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
    return pattern.test(emailAddress);
}

function checkName(name){
var pattern = new RegExp(/^([a-z]+) ([a-z]+)$/);
return pattern.test(name);
}

function formControl(){
var error=0;
var errorTXT='';
var inputs = $("#CustomerForm input ");
$.each(inputs, function(key, value) {
    if(value["name"]=='name'){
        if(value['value']!='' && error==0){
            if(checkName(value['value'])){
                error=0;
                }
                else{
                    error=1;
                    errorTXT='your error msg text for name input when there arent two words';
                    return false;
                }
        }
        else{
            error=1;
            errorTXT='your error msg text for empty name field';
            return false;
            }
        }
     if(value["name"]=='email'){
        if(value['value']!='' && error==0){
            if(kontrolaMailu(value['value'])){
                error=0;
                }
                else{
                    error=1;
                    errorTXT='your error msg text for wrong mail format';
                    return false;
                }

        }
        else{
            error=1;
            errorTXT='your error msg text for empty mail';
            return false;
            }
        }
}

     if(error != 0){
      $('#submit').attr('title',errorTXT);
      $('#submit').attr('disabled', 'disabled');
      $('#submit').addClass('disabled');//css class for disabled button
      $('#msg').val(errorTXT);
     }
     else{
      $('#submit').removeAttr('title');
      $('#submit').removeAttr('disabled');
      $('#submit').removeClass('disabled');//css class for disabled button
      $('#msg').val('');
     }
}

異なる文字セットを使用して言語で作業する必要がなかったので、 value='اسم الگريم' のような値がこれらの正規表現を通過するかどうかはわかりません

于 2012-09-14T12:47:17.220 に答える