JSFiddle - React, Tailwind, and code Playground

by JamesWolf

HTML

<input id="hi_1" class="placeholder_required" value="hi_1" placeholder="hi_1">
<br>
<input id="hi_2" class="placeholder_required" value="hi_2" placeholder="hi_2">
<br>
<input id="hi_3" class="placeholder_required" value="hi_3" placeholder="hi_3">
<br>

<input class="placeholder_optional" id="hi_4" value="hi_4" placeholder="hi_4">
<br>
<textarea name="" id="hi_5" cols="30" rows="10" class="placeholder_optional" placeholder="text">text</textarea>

<button id="submit">
  submit
</button>

JavaScript

$(function() {
	
	  $("#submit").click(function() {
	    var chk = chk_palceholder();
	    //如果 chk 是true就往下送 
	    alert(chk);
	  });
	})

	function chk_palceholder() {
	  //檢查必填
	  var chk = true;
	  $(".placeholder_required").each(function(k, v) {
    
	      if (document.getElementById($(this).attr('id')).value == $(this).attr("placeholder")) {
	        chk = false;
	      }
	    })
	    //檢查非必填
	  $(".placeholder_optional").each(function(k, v) {
	    if (document.getElementById($(this).attr('id')).value == $(this).attr("placeholder")) {
	      document.getElementById($(this).attr('id')).value = '';
	    }
	  })

	  return chk;
	}