投稿する前に空のフォームフィールドを更新する

Question

ユーザーがボタンをクリックしてHTMLフォームを送信すると、（メールアドレスを取得するために使用された）入力のいずれかにコンテンツが含まれているかどうかを確認したいと思います。 （つまり、ユーザーは自分のメールアドレスを入力していますか？）

もしそうなら、フォームを提出してください。

入力されていない場合は、ユーザーには表示されないもの（例：hello@hello.com）を入力してからフォームを送信してください。

私はいくつかのことを試しましたが、私はフォームのサブミット部分を中断するようです。

Answer 1

フォームは提出され、それはとにかくリフレッシュされます。

私は、結果がrem変数に割り当てられたランダム電子メールジェネレータを含むようにコードを変更しました。それは非常に簡単です。

var rem = Array.from({length:15}) // generate an empty array of length 15 
       .reduce(r => Math.floor(Math.random()*10) + r,"@hello.com"); 

それは長さ15（Array.from({length:15})）のアレイを生成し、コールバックでrある"@hello.com"の初期値に減少させます。各ターンでは、初期値（"@hello.com"）に0-9の間のランダムな整数が付加され、642273534410880@hello.comのような電子メールアドレス文字列が返されます。

Answer 2

• は、そのハンドラ関数
• 戻りtrue内のあなたの検証を実行し、クライアント側で（サーバー呼び出しを行う）ボタンのonClickハンドルあなたがに満足している場合（サーバーの呼び出しを続行）検証に満足できない場合は、
• false（サーバーコールのキャンセル）を返します。検証が失敗したときにあなたには、いくつかのデフォルト値でサーバーの呼び出しを続行する場合さて、あなたはtrueを返す前にクリックハンドラでそれらを記述する必要があり

。

Answer 3

フォームのsubmitイベントを聞くだけで、フィールドが空でないことを確認してください。そうであれば、サーバに送るinput[type="hidden"]にデータを保存することができます。

私はe.preventDefaultを使用していますので、フォームは送信されません。

document.querySelector('form').addEventListener('submit', function(e) { 
 
    e.preventDefault(); 
 
    var email = e.target.email.value; 
 
    if (!email) { 
 
    document.querySelector('#hidden').value = 'hello@hello.com'; 
 
    } 
 
    
 
    console.log(document.querySelector('#hidden').value); 
 
});

<form> 
 
    <input type="hidden" id="hidden" /> 
 
    <input name="email" type="text" placeholder="email" /> 
 
    <button>Submit</button> 
 
</form>

Answer 4

私はあなたがこのようなものであってもよいし、あなたのHTMLで送信ボタンを持っているとします。この中にあなたがロジックに何かを追加することができ、

<input type="submit" value="submit" onClick="checkInputFields()" /> 

ご注意checkInputFields機能へこれらの行に沿って：

function checkInputFields() { 
    // your usual submit logic 
    var emailAddress; 
    emailAddress = document.getElementById("emailAddressID").value; 
    if (emailAddress == "") { 
     //email address is not present 
     // create a unique dummy email address 
     var emailAddress = "DummyEmail" + Math.floor((1 + Math.random()) * 0x10000) 
    .toString(16) 
     .substring(1)+ "@hello.com" 

    }; 
} 

電子メールIDは実際には一意ではありませんが、これは出発点になるはずです。

何も

document.querySelector('form') 
 
     .addEventListener('submit', function(e){ 
 
             var rem = Array.from({length:15}) 
 
                .reduce(r => Math.floor(Math.random()*10) + r,"@hello.com"); 
 
             e.target.em.defaultValue = rem; 
 
             console.log(e.target.em.value); 
 
            });

<form> 
 
    <label>email:</label> 
 
    <input name="em" type="email" placeholder="abc@xyz.com" /> 
 
    <button type="submit">Submit</button> 
 
</form>

と一度に入力されていない場合は、入力要素にデフォルト値をasignnますあなたはまた、名前が示すように、入力要素のdefaulValueプロパティを使用することができ