ãã©ãŒã ã®ç®¡çè ã®äžã«ã¯ããã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããæ¹æ³ãåãããªãããšé ãæ±ããŠããæ¹ãå€ãã®ã§ã¯ãªãã§ããããïŒ
çµè«ããèšããšãHTML5ãJavaScriptãjQueryã䜿ã£ãŠã察å¿ããã³ãŒããæ¿å ¥ããã°ããã©ãŒã ããªããŒã·ã§ã³ãå®è£ å¯èœã§ãã
ããã§ãæ¬èšäºã§ã¯ãã©ãŒã ããªããŒã·ã§ã³ã«é¢ããåºæ¬çãªç¥èãèžãŸããŠãHTML5ãJavaScriptãjQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãéã®ã³ãŒããªã©ãã玹ä»ããŸãã
ãŸãããã©ãŒã ããªããŒã·ã§ã³æ©èœãè±å¯ãªãã©ãŒã äœæããŒã«ã䜿çšãããå Žåããã©ãŒã äœæããŒã«ãformrunããããããã§ããformrunã䜿çšãããšäžèšã®6ã€ã®ã¡ãªããããããŸãã
- ãã©ãŒã ããªããŒã·ã§ã³æ©èœãè±å¯
- ãªã¢ã«ã¿ã€ã ãšã©ãŒïŒèªåïŒãåè§èªåå€æãäœæèªåå ¥åæ©èœãå©çšã§ãã
- ã¯ã³ã¯ãªãã¯ã§recaptchaèšå®å¯èœ
- ããŠã¹æäœã§ãã¶ã€ã³èšå®å¯èœ
- ãåãåãã管çãã¡ãŒã«å¯Ÿå¿ãå¯èœ
- èªåã¡ãŒã«ãChatworkãªã©ããŒã«éç¥ãŸã§ã€ããŠãã
以äžã®æ©èœãå®åãããŠãããåºæ¬æéã¯ç¡æã§ãã
ããžãã¹çšãã©ãŒã äœæããŒã«ãformrunãã§ã¯ããè€æ°äººã§ãã¶ã€ã³æ§ã®é«ããã©ãŒã ãã管çãã§ããŸãã
ãŸãformrunã§ã¯ãŠãŒã¶ãŒã«èŠªåãªãã©ãŒã ãäœæããããã«å¿
èŠãªEFOæ©èœãæèŒãããŠããŸãã
ç®æ¬¡
- ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãšã¯ïŒ
- ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒã®éèŠæ§
- ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãæ¹æ³3éž
- HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éž
- JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã
- jQueryãå©çšããŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éž
- ãã©ãŒã äœæããŒã«ãformrunããããããïŒ
- ãã©ãŒã ããªããŒã·ã§ã³ãå¹çåãããå ŽåEFO察çãå å®ããŠããformrunã®å©çšãæ€èšããŸããã
ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãšã¯ïŒ
ãããããã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãšã¯ãã©ãããæå³ãªã®ã§ããããïŒçµè«ããèšããšããã©ãŒã ããªããŒã·ã§ã³ã¯ããŠãŒã¶ãŒããã©ãŒã ã«å ¥åããå€ãæ£ããå€ã§ããããšããã§ãã¯ããããšãèšããŸãã
ãã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããã°ããŠãŒã¶ãŒã¯ãã©ãŒã ã«å ¥åããå€ãæ£ããå€ã§ç¡ãããšãç解ããæ£ããå€ãåå ¥åããŸãããã£ãŠããã©ãŒã ã«èª€ã£ãå€ãèšèŒããããŸãŸãéä¿¡ãããããšãé²ãããšãå¯èœã§ãã
å ·äœçã«ã¯äžèšã®ãããªåœ¢åŒã§æ£ããå€ãå ¥åãããŠããªãããšããŠãŒã¶ãŒã«äŒããŸãã
- ãã®ãã£ãŒã«ãã¯å ¥åå¿ é ã§ã
- é»è©±çªå·ã¯âïŒãã€ãã³ïŒãå«ã圢ã§å ¥åããŠãã ãã
- ã¡ãŒã«ã¢ãã¬ã¹ã¯ïŒ ãå«ã圢ã§æ£ããå ¥åããŠãã ãã
ãã©ãŒã ããªããŒã·ã§ã³æ©èœãå®è£ ãããŠããã°ãäžèšã®ããã«ãŠãŒã¶ãŒã«æ£ããå€ã®å ¥åãããªããããšãã§ããŸãã
ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒã®éèŠæ§
ãã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããã°ããŠãŒã¶ãŒã«æ£ããå€ã®å ¥åãããªããããšãã§ããŸããããããæ£ããå€ããŠãŒã¶ãŒãå ¥åã§ããããšã§å ·äœçã«ã©ã®ãããªã¡ãªãããããã®ã§ããããã
ãã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããéèŠæ§ã¯äžèšã®éãã§ãã
- ãŠãŒã¶ãŒã®æ å ±ãæ£ç¢ºãã€å®å šã«åãæ±ãã
- äžæ£ãªããŒã¿ã®å ¥åãé²ããã¢ããªã±ãŒã·ã§ã³ã®åäœãå®ã
- ãŠãŒã¶ãŒã«å®å šãªãã¹ã¯ãŒãã®å ¥åãããªããã
ãã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããŠããªããã°ãæªæã®ãããŠãŒã¶ãŒãã¢ããªã±ãŒã·ã§ã³ã®åäœã«å±å®³ãå ããããã«ãäžæ£ãªå€ãèšå ¥ããå¯èœæ§ããããŸãã
ãã®ããã管çè ããã©ãŒã ãå®ãããã«ãããŠãŒã¶ãŒã®å人æ å ±ãå®ãããã«ãããã©ãŒã ããªããŒã·ã§ã³ã¯éèŠã§ãã
ãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãæ¹æ³3éž
ãã©ãŒã ããªããŒã·ã§ã³ãè¡ãæ¹æ³ã¯äžèšã®3ã€ã§ãã
- HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
- JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
- jQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
èªç€ŸãéçšããŠãããã©ãŒã ã®èšèªã«ããããŠãããããã®æ¹æ³ãåç §ãããã©ãŒã ããªããŒã·ã§ã³ãå®è£ ããŸãããã
HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãå Žåãäž»ã«äžèšã®ãããªå€ã®ãã§ãã¯ãã§ããŸãã
- ãã£ãŒã«ãã®å ¥åå¿ é
- ã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒç¢ºèª
- URLã®æžåŒç¢ºèª
- æ°å€ã®æ倧å€ã»æå°å€ãæå®
- æååã®æåæ°ãæå®
- ãã¡ã€ã«ã®æ¡åŒµåãå¶é
- æ£èŠè¡šçŸã䜿ã£ãŠå ¥åå€ã®ãã¿ãŒã³ãæå®
JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãå Žåã¯ãæäœéã®ããªããŒã·ã§ã³ã§ããã°ãæšæºã®JavaScriptã§å®è£ ã§ããŸããå ·äœçã«ã¯äžèšã®ãããªå€ããã§ãã¯ã§ããŸãã
- ãã£ãŒã«ãã®å ¥åå¿ é
- é»è©±çªå·ã®æžåŒç¢ºèª
- ã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒç¢ºèª
- ãã¹ã¯ãŒãã®æžåŒç¢ºèª
- 件åã»ãåãåããå 容ã®æåæ°ãæå®
jQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ã
jQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãå Žåãäžèšã®ãããªå€ããã§ãã¯ã§ããŸãã
- æ°å€ã®å ¥å圢åŒ
- ã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒç¢ºèª
- é»è©±çªå·ã®æžåŒç¢ºèª
- éµäŸ¿çªå·ã®æžåŒç¢ºèª
- URLã®æžåŒç¢ºèª
- ãã¹ã¯ãŒãã®æžåŒç¢ºèª
- ã²ãããªã»ããããªã®æå®
formrunãªãã³ãŒããæžãããšãªãå
¥åæåæ°ã«äžéã決ããããšãã¡ãŒã«ã¢ãã¬ã¹ã®å
¥åã§ãïŒ ããå«ã圢åŒãªã®ãã確èªã§ããŸãããã²ãformrunã§ãã©ãŒã ãäœæããŠã¿ãŠãã ããã
HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éž
HTML5ã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éžãã玹ä»ããŸããæ¬èšäºã§ã玹ä»ãããã©ãŒã ããªããŒã·ã§ã³ã®ã³ãŒãã¯äžèšã®éãã§ãã
- ãã£ãŒã«ããå ¥åå¿ é ã«ããéã®ã³ãŒã
- ã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒãæ€èšŒããéã®ã³ãŒã
- URLã®æžåŒãæ€èšŒããéã®ã³ãŒã
- æ°å€ã®æ倧å€ã»æå°å€ãæå®ããéã®ã³ãŒã
- æååã®æ倧æåæ°ã»æå°æåæ°ãæå®ããéã®ã³ãŒã
- ãã¡ã€ã«ã®æ¡åŒµåãå¶éããéã®ã³ãŒã
- å ¥åå€ã®ãã¿ãŒã³ãæ£èŠè¡šçŸã§æå®ããéã®ã³ãŒã
â HTML5ã䜿ã£ãŠãã£ãŒã«ããå ¥åå¿ é ã«ããéã®ã³ãŒã
HTML5ã䜿ã£ãŠãã£ãŒã«ããå ¥åå¿ é ã«ããéã¯ãrequiredå±æ§ãæå®ããå¿ èŠããããŸããå ·äœçã«ã¯äžèšã®ã³ãŒããæ¿å ¥ããã°ããã£ãŒã«ããå ¥åå¿ é ã«ã§ããŸãã
<input type="text" name="message" required />
äžèšã®ã³ãŒããæ¿å ¥ããã°ããŠãŒã¶ãŒãå ¥åå¿ é ã®ãã£ãŒã«ãã空çœã®ãŸãŸãã©ãŒã ãéä¿¡ããããšããå Žåãããã®ãã£ãŒã«ãã¯å ¥åå¿ é ã§ããã®ãããªæèšã衚瀺ããããŠãŒã¶ãŒã«åå ¥åãããªãããŸãã
â¡HTML5ã䜿ã£ãŠã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒãæ€èšŒããéã®ã³ãŒã
HTML5ã䜿ã£ãŠã¡ãŒã«ã¢ãã¬ã¹ã®æžåŒãæ€èšŒããéã¯ãinput type=”email”ã®ã³ãŒããæ¿å ¥ããŸããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<input type="email" name="email" />
äžèšã®ã³ãŒããæ¿å ¥ããã°ãã¡ãŒã«ã¢ãã¬ã¹ã«ãïŒ ããå«ãŸããŠããªãå Žåãªã©ãæå¹ãªã¡ãŒã«ã¢ãã¬ã¹ãå ¥åãããŠããªããã°ãã¡ãŒã«ã¢ãã¬ã¹ã®åå ¥åããŠãŒã¶ãŒã«ããªããããšãã§ããŸãã
â¢HTML5ã䜿ã£ãŠURLã®æžåŒãæ€èšŒããéã®ã³ãŒã
HTML5ã䜿ã£ãŠURLã®æžåŒãæ€èšŒããéã¯ãinput type=”url”ã®ã³ãŒããæ¿å ¥ããŸããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<input type="url" name="website" />
äžèšã®ã³ãŒããæ¿å ¥ããã°ãæå¹ãªURLãå ¥åãããŠããªãå ŽåããŠãŒã¶ãŒã«æå¹ãªURLã®åå ¥åãããªããããšãã§ããŸãã
â£HTML5ã䜿ã£ãŠæ°å€ã®æ倧å€ã»æå°å€ãæå®ããéã®ã³ãŒã
HTML5ã䜿ã£ãŠæ°å€ã®æ倧å€ã»æå°å€ãæå®ããéã¯ãinput type=”number”ã®ã³ãŒããæ¿å ¥ããŠãmaxå±æ§ãšminå±æ§ã§æ倧å€ã»æå°å€ãæå®ããŸããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<input type="number" name="age" max="12" min="6" />
äžèšã®ã³ãŒããæ¿å ¥ããã°ããŠãŒã¶ãŒã«æ倧å€ã»æå°å€ã®æå®ã®ç¯å²å ã§æ°å€ãå ¥åããããšãããªããããšãã§ããŸãã
â€HTML5ã䜿ã£ãŠæååã®æ倧æåæ°ã»æå°æåæ°ãæå®ããéã®ã³ãŒã
HTML5ã䜿ã£ãŠæååã®æ倧æåæ°ã»æå°æåæ°ãæå®ããéã¯ãmaxlengthå±æ§ãšminlengthå±æ§ãæå®ããŸããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<input type="text" name="message" minlength="5" />
<textarea name="message" maxlength="140"></textarea>
äžèšã®ã³ãŒããæ¿å ¥ããã°ããŠãŒã¶ãŒã«æ倧æåæ°ã»æå°æåæ°ã®ç¯å²å ã§æåãå ¥åããããšãããªããããšãã§ããŸãã
â¥HTML5ã䜿ã£ãŠãã¡ã€ã«ã®æ¡åŒµåãå¶éããéã®ã³ãŒã
HTML5ã䜿ã£ãŠãã¡ã€ã«ã®æ¡åŒµåãå¶éããéã¯ãacceptå±æ§ã§èš±å¯ãããã¡ã€ã«ã®MIMEã¿ã€ãããã³æ¡åŒµåãæå®ããŸããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<input type="file" accept=".jpg,.gif" />
äžèšã®ã³ãŒããæ¿å ¥ããã°ããã¡ã€ã«ã®æ¡åŒµåã®ã¿ã€ããå¶éã§ããŸãã
âŠHTML5ã䜿ã£ãŠå ¥åå€ã®ãã¿ãŒã³ãæ£èŠè¡šçŸã§æå®ããéã®ã³ãŒã
HTML5ã䜿ã£ãŠå ¥åå€ã®ãã¿ãŒã³ãæ£èŠè¡šçŸã§æå®ããéã¯ãpatternå±æ§ã§ãå ¥åå€ã®ãã¿ãŒã³ãæ£èŠè¡šçŸã§æå®ããŸããããå ·äœçã«ã¯äžèšã®ããã«ã³ãŒããæ¿å ¥ããŸãããã
<!-- äŸïŒåè§è±æ°å -->
<input type="text" pattern="^[0-9A-Za-z]+$" />
äžèšã®ã³ãŒããæ¿å ¥ããã°ã䜿çšããæåã®ãã¿ãŒã³ãæå®ã§ããŸãã
JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã
JavaScriptã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãéã¯äžèšã®ã³ãŒããæ¿å ¥ããŸãããã
äžèšã®ã³ãŒããæ¿å ¥ããã°ãååãé»è©±çªå·ãã¡ãŒã«ã¢ãã¬ã¹ããã¹ã¯ãŒããå€ã®åå ¥åã件åããåãåããå 容ã«é¢ããããªããŒã·ã§ã³ã®ãã§ãã¯ãã§ããŸãã
// ãåãåãããã©ãŒã ã®éä¿¡ã€ãã³ããååŸ
document.getElementById("contactForm").addEventListener("submit", function(e) {
// åå
¥åãã£ãŒã«ãã®å€ãååŸ
const name = document.getElementById("name").value;
const phone = document.getElementById("phone").value;
const email = document.getElementById("email").value;
const password = document.getElementById("password").value;
const passwordConfirm = document.getElementById("passwordConfirm").value;
const subject = document.getElementById("subject").value;
const message = document.getElementById("message").value;
// ååã®æ€èšŒ: æªå
¥åããŸãã¯10æåãè¶
ããå Žåã¯ãšã©ãŒ
if (!name || name.length > 10) {
alert("ååãæ£ããå
¥åããŠãã ããã");
e.preventDefault(); // ãã©ãŒã ã®éä¿¡ããã£ã³ã»ã«
return;
}
// é»è©±çªå·ã®æ€èšŒ: æ°åãšãã€ãã³ä»¥å€ã®æåãå«ãå Žåã¯ãšã©ãŒ
const phonePattern = /^[0-9\-]+$/;
if (!phone.match(phonePattern)) {
alert("æ£ããé»è©±çªå·ã®åœ¢åŒã§å
¥åããŠãã ããã");
e.preventDefault();
return;
}
// ãã¹ã¯ãŒãã®æ€èšŒ: äºã€ã®ãã¹ã¯ãŒããã£ãŒã«ãã®å€ãäžèŽããªãå Žåã¯ãšã©ãŒ
if (password !== passwordConfirm) {
alert("å
¥åããããã¹ã¯ãŒããäžèŽããŸããã");
e.preventDefault();
return;
}
// 件åã®æ€èšŒ: æªå
¥åããŸãã¯30æåãè¶
ããå Žåã¯ãšã©ãŒ
if (!subject || subject.length > 30) {
alert("件åãæ£ããå
¥åããŠãã ããã");
e.preventDefault();
return;
}
// ãåãåããå
容ã®æ€èšŒ: æªå
¥åããŸãã¯200æåãè¶
ããå Žåã¯ãšã©ãŒ
if (!message || message.length > 200) {
alert("ãåãåããå
容ãæ£ããå
¥åããŠãã ããã");
e.preventDefault();
return;
}
});
formrunãªãã³ãŒããæžãããšãªãç°¡åã«å
¥åæåæ°ã«äžéã決ããããšãã¡ãŒã«ã¢ãã¬ã¹ã®å
¥åã§ãïŒ ããå«ã圢åŒãªã®ãã確èªã§ããŸãããã²ãformrunã§ãã©ãŒã ãäœæããŠã¿ãŠãã ããã
jQueryãå©çšããŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éž
jQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ïŒãã§ãã¯ïŒãè¡ãéã®ã³ãŒã7éžãã玹ä»ããŸããæ¬èšäºã§ã玹ä»ãããã©ãŒã ããªããŒã·ã§ã³ã®ã³ãŒãã¯äžèšã®éãã§ãã
- æ°å€ã®å ¥å圢åŒãæ€èšŒããéã®ã³ãŒã
- ã¡ãŒã«ã¢ãã¬ã¹æ€èšŒããéã®ã³ãŒã
- é»è©±çªå·ãæ€èšŒããéã®ã³ãŒã
- éµäŸ¿çªå·ãæ€èšŒããéã®ã³ãŒã
- URLãæ€èšŒããéã®ã³ãŒã
- ãã¹ã¯ãŒããæ€èšŒããéã®ã³ãŒã
- ã²ãããªã»ããããªãæ€èšŒããéã®ã³ãŒã
â jQueryãå©çšããŠæ°å€ã®å ¥å圢åŒãæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠæ°å€ã®å ¥å圢åŒãæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// æ°å€ïŒå
šè§ã»åè§ïŒã®æ£èŠè¡šçŸ
var regex = /^[0-9ïŒ-ïŒ]*$/;
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('æ°å€ïŒå
šè§ã»åè§ïŒã®ã¿ãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãæ°å€ã®å šè§ã»åè§ãæå®ã§ããŸãã
â¡jQueryãå©çšããŠã¡ãŒã«ã¢ãã¬ã¹æ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠã¡ãŒã«ã¢ãã¬ã¹ãæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var email = $('#myInput').val();
var regex = /^[\w.-]+@[\w.-]+\.[a-zA-Z]{2,}$/;
if (regex.test(email)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('æ£ããã¡ãŒã«ã¢ãã¬ã¹ã®åœ¢åŒãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ããŠãŒã¶ãŒã«æ£ããã¡ãŒã«ã¢ãã¬ã¹ã®åœ¢åŒãå ¥åããããã«ããªããããšãã§ããŸãã
â¢jQueryãå©çšããŠé»è©±çªå·ãæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠé»è©±çªå·ãæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// æ¥æ¬ã®é»è©±çªå·ã®æ£èŠè¡šçŸ (åºå®é»è©±ãæºåž¯ãããªãŒãã€ã€ã«ãIPé»è©±ãèæ
®)
var regex = /^(0[5-9]0[-(]?[0-9]{4}[-)]?[0-9]{4}|0120[-]?\d{1,3}[-]?\d{4}|050[-]?\d{4}[-]?\d{4}|0[1-9][-]?\d{1,4}[-]?\d{1,4}[-]?\d{4})*$/;
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('æå¹ãªé»è©±çªå·ãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãé»è©±çªå·ãæ£ãã圢åŒã§èšèŒãããŠãããæ€èšŒã§ããŸãã
â£jQueryãå©çšããŠéµäŸ¿çªå·ãæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠéµäŸ¿çªå·ãæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// æ¥æ¬ã®éµäŸ¿çªå·ã®æ£èŠè¡šçŸïŒå
šè§ã»åè§ããã€ãã³ããã»ãªãïŒ
var regex = /^(?:\d{3}-?\d{4}|[ïŒ-ïŒ]{3}-?[ïŒ-ïŒ]{4})$/;
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('æ£ããéµäŸ¿çªå·ãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãéµäŸ¿çªå·ãæ£ãã圢åŒã§èšèŒãããŠãããæ€èšŒã§ããŸãã
â€jQueryãå©çšããŠURLãæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠURLãæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// URLïŒhttpsã»httpïŒã®æ£èŠè¡šçŸ
var regex = new RegExp('^(https?:\\/\\/)?'+
'(([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}'+
'(\\/[-a-z\\d%_.~+]*)*', 'i');
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('æå¹ãªURLãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãURLãæ£ãã圢åŒã§èšèŒãããŠãããæ€èšŒã§ããŸãã
â¥jQueryãå©çšããŠãã¹ã¯ãŒããæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠãã¹ã¯ãŒããæ€èšŒããéã¯ãäžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// åè§æ°åã®ã¿ã®æ£èŠè¡šçŸ
var regex = /^\d+$/;
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('åè§æ°åã®ã¿ãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãå ¥åããããã¹ã¯ãŒããæ£èŠè¡šçŸã«ããããããæ€èšŒã§ããŸãã
âŠjQueryãå©çšããŠã²ãããªã»ããããªãæ€èšŒããéã®ã³ãŒã
jQueryãå©çšããŠã²ãããªã»ããããªãæ€èšŒããéã¯äžèšã®ã³ãŒããæ¿å ¥ããŸãããã
$('#myForm').on('submit', function(event) {
event.preventDefault();
var input = $('#myInput').val();
// ã²ãããªã»ã«ã¿ã«ãïŒå
šè§ã»åè§ïŒã®æ£èŠè¡šçŸ
var regex = /^[\u3040-\u309F\u30A0-\u30FF-ïŸïŸïŸ]*$/;
if (regex.test(input)) {
$('#errorMessage').text('');
this.submit();
} else {
$('#errorMessage').text('ã²ãããªã»ã«ã¿ã«ãïŒå
šè§ã»åè§ïŒã®ã¿ãå
¥åããŠãã ããã');
}
});
äžèšã®ã³ãŒããæ¿å ¥ããã°ãã²ãããªã»ããããªã®å ¥åå€ãæ£ãããæ€èšŒã§ããŸãã
ãã©ãŒã äœæããŒã«ãformrunããããããïŒ
EFOïŒãã©ãŒã æé©åïŒæ©èœãå©çšãããå Žåããã©ãŒã äœæããŒã«ãformrunããããããã§ããformrunã«ã¯äžèšã®4ã€ã®ç¹åŸŽããããŸãã
- EFOïŒãã©ãŒã æé©åïŒã«åœ¹ç«ã€
- ãã³ãã¬ãŒããè±å¯
- åãåãã管çãŸã§ã§ãã
- ã»ãã¥ãªãã£ãé«ã
EFOïŒãã©ãŒã æé©åïŒã«åœ¹ç«ã€
EFOïŒãã©ãŒã æé©åïŒã«åœ¹ç«ãŠãããããšãformrunã«ç§»è¡ããã¡ãªããã®1ã€ã§ãããŠãŒã¶ãŒã«èŠªåãªãã©ãŒã ãäœæããããã«å¿ èŠãªEFOæ©èœããformrunã«ã¯æèŒãããŠããŸãã
äŸãã°ä»¥äžã®ãããªæ©èœã§ãã
- ãªã¢ã«ããªããŒã·ã§ã³æ©èœ
- äœæè£å®æ©èœ
- ããªã¬ãèªåå ¥åæ©èœ
- å šè§å ¥åã®èªååè§å
ãŠãŒã¶ãŒãå ¥åãã¹ãã¬ã¹ã«æããªããããªãã©ãŒã ãäœæã§ããããããŠãŒã¶ãŒã®é¢è±ãé²æ¢ãå¯èœã§ãã
âŒformrunã®EFOæ©èœã«ã€ããŠè©³çŽ°ã¯ãã¡ãããã確èªãã ãã
ãã³ãã¬ãŒãã120çš®é¡ä»¥äžãã
formrunã¯ãã³ãã¬ãŒããè±å¯ãªã®ãç¹åŸŽã§ãã120çš®é¡ä»¥äžã®ãã³ãã¬ãŒããæã£ãŠãããããå¹ åºãæ¥çš®ãçšéã«åããããã©ãŒã ã«å¯Ÿå¿ã§ããŸãã
âŒformrunã®ãã³ãã¬ãŒãäžèŠ§ã¯ãã¡ãããã確èªãã ãã
顧客管çãŸã§æŽ»çšã§ãã
formrunã掻çšããã°ã顧客管çãŸã§å¯Ÿå¿ã§ããŸããformrunã掻çšã§ããã®ã¯ããã©ãŒã äœæã®ã¿ã§ã¯ãããŸããã
åãåãããã©ãŒã ã掻çšãããªããæãæŒãããªãããã«å¯Ÿå¿ããªããã°ãªããŸããããåãåãããã顧客管çãŸã§äžæ¬ããŠå¯èœãªããŒã«ã§ãã
ãŸããformrunã¯å¯Ÿå¿ç¶æ³ãã¹ããŒã¿ã¹å¥ã«ç®¡çã§ããã®ãã¡ãªããã§ããæªå¯Ÿå¿ã»å¯Ÿå¿äžã»å¯Ÿå¿æžã¿ã»ååçºéæžã¿ãªã©ãã¹ããŒã¿ã¹ã¯èªç€Ÿã管çããããããã«èšå®ã§ããŸãã
âŒformrunã®é¡§å®¢ç®¡çæ©èœã¯ãã¡ãã確èªãã ãã
ã»ãã¥ãªãã£å¯Ÿçãäžå š
ã»ãã¥ãªãã£ãé«ãã®ãformrunã®é åã®ãã€ã³ãã§ãããISO 27001 (ISMS)ãã®èªèšŒååŸããã©ã€ãã·ãŒããŒã¯ã®ä»äžèªå®ãSSL/ TLSã«ããæå·åéä¿¡ã24æé365æ¥ã®ãµãŒããŒç£èŠäœå¶ãªã©å¯ŸçããšãããŠããŸãã
ãã©ãŒã ã掻çšããéã¯ãååãäœæãã¡ãŒã«ã¢ãã¬ã¹ãªã©éèŠãªå人æ å ±ãåãæ±ããŸãããŠãŒã¶ãŒã«å®å¿ããŠãã©ãŒã ãå©çšããŠãããããã«ãããã©ãŒã ã®ã»ãã¥ãªãã£ã¯å¿ é ã§ãã
âŒformrunã®ã»ãã¥ãªãã£ã®è©³çŽ°ã¯ãã¡ããã確èªãã ãã
ãã©ãŒã ããªããŒã·ã§ã³ãå¹çåãããå ŽåEFO察çãå å®ããŠããformrunã®å©çšãæ€èšããŸããã
æ¬èšäºã§ã¯ãã©ãŒã ããªããŒã·ã§ã³ã«é¢ããåºæ¬çãªç¥èãèžãŸããŠãHTML5ãJavaScriptãjQueryã䜿ã£ãŠãã©ãŒã ããªããŒã·ã§ã³ãè¡ãéã®ã³ãŒããªã©ãã玹ä»ããŸããã
ãã©ãŒã ã®ç®¡çè ã¯èªç€Ÿã®ãã©ãŒã ã®èšèªã«ããããŠãé©åãªã³ãŒããæ¿å ¥ããã°ããã©ãŒã ã«èšèŒãããå€ãæ£ããå€ãæ€èšŒã§ããŸãããããŠãæ£ããå€ãæ¿å ¥ãããŠããªãå Žåãæ£ããå€ãåå ¥åããããã«ãŠãŒã¶ãŒã«ããªããããšãã§ããŸãã
ãã©ãŒã ããªããŒã·ã§ã³ã®å®è£ ã¯ãã¢ããªã±ãŒã·ã§ã³ã®åäœãå®ãããŠãŒã¶ãŒã®å人æ å ±ãå®ãããšã«ã€ãªããããé©åã«èšå®ããŠãããŸãããã
ãããããã©ãŒã ãæ¬æ Œçã«éçšãããå Žåã«ã¯ãçŸåšäœ¿çšããŠãããã©ãŒã äœæããŒã«ã®æ©èœãäžååã«æããããããšãããã§ãããã
- ãã¶ã€ã³æ§ã®é«ããã©ãŒã ã«ããåçè ãå ¥åãããããã©ãŒã ã«ããã
- ãµã€ãããµãŒãã¹ã®äžç芳ã«ãã£ããã©ãŒã ã«ããã
- èªåè¿ä¿¡ã¡ãŒã«ã»ãã¡ã€ã«ã¢ããããŒãé ç®ãªã©ãããå å®ããæ©èœã䜿ããã
äžèšã®ããã«æããŠãã管çè
ã®æ¹ã¯ãã©ãŒã äœæããŒã«ãformrunããæ€èšããŠã¿ãã®ãããããã§ããç¡æã§ã®å©çšå¯èœãªããããã²äžåºŠãè©ŠããŠã¿ãŠã¯ãããã§ããããã
SansanãBASEãheyãDMMãªã©å¹
åºãèŠæš¡ã®äŒæ¥ã«å°å
¥ãããŠãããèªç€Ÿã«æé©ãªãã©ãŒã ãäœãããšãå¯èœã§ãã
formrunããã©ãŒã äœæã顧客管çã«é¢ããæ å ±ãçºä¿¡ããŠãããŸãã
EFOïŒãšã³ããªãŒãã©ãŒã æé©åïŒãåãåãã察å¿ãªã©ã
ãã©ãŒã ã«é¢ãããæ©ã¿ã解決ããŸãã