我想验证自定义字段中是否有任何文本，但仅限于上面选择了自定义选项。我是非常新的HTML（好吧有C）所以请原谅我的其余错误（可能很多），但请指出他们的解释:) 我尝试过跟随人们在这里发布的其他问题，情况非常相似，但没有取得任何进展。 谢谢！
<html lang="en">
<main>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<h1>D D D S </h1>
<link rel="stylesheet"href="request.css">
<script src="jquery.js"></script>
<script src="jquery.validate.js"></script>
<script>
jQuery(function ($) {
$('#myInput').validate({
debug: true,
rules: {
customdrinkfield: {
required: function (el) {
return $(el).closest('form').find('.drinkChoice').val() == 'custom'; } }
}
});
}); </script>
<script type="text/javascript">
function checkvalue(val) {
var element=document.getElementById('çustomdrinkfield');
if(val=="custom")
document.getElementById('customdrinkfield').style.display='block';
else
document.getElementById('customdrinkfield').style.display='none';
}
</script>
</head>
<body>
<div class="field">
<!--name field //-->
<form class="form-request" action="" method="POST" id="myInput>
<label for="inputName" class="sr-only"></label>
<input for="name" name="inputName" value="" id="inputName" class="form-control" placeholder="Name" maxlength="16" required autofocus>
<!--location field //-->
<br>
<select name="location" onchange='checkvalue(this.value)' required>
<option value="" disabled selected hidden>Delivery Location</option>
<option value="deck">Deck</option>
<option value="grass">Grass</option>
<option value="poolShallow">Pool shallow</option>
<option value="poolDeep">Pool Deep</option>
</select>
<!--drink field //-->
<br>
<select name="drink" id="drinkChoice" onchange='checkvalue(this.value);' required>
<option value="" disabled selected hidden>Drink Choice</option>
<option value="Slushie A">Slushie A</option>
<option value="Sluishie B">Slushie B</option>
<option value="water">Water</option>
<option value="custom">Custom</option>
</select>
<!--custom field //-->
<input type="text" name="customdrinkfield" id="customdrinkfield" style='display:none;' placeholder="Custom"/>
</br>
<!--submit //-->
<button id="btnRequest" type="submit" formvalidate value="Submit">Request</button>
</form>
</div>
</body>
</main>
</html>
答案 0 :(得分：0)
你快到了。但问题是，当您尝试使用drinkChoice找到select element classname时，drinkChoice是id给element #drinkChoice并且您必须使用.drinkChoice而不是rule statement。因此，您更新的customdrinkfield: {
required: function(el) {
return $(el).closest('form').find('#drinkChoice').val() == 'custom';
//^^this here
}
}
应如下所示：
javascript<强> Here is the DEMO
我发现的错误或在下面说的更好是一种很好的做法：
body结束之前，在页面下方保留<script type="text/javascript">相关内容。它提高了性能。js，并将所有checkvalue代码包装在其中。不需要多个部件。html功能。如果你从下到上，它将无法正常工作。所以这里有更新的<html lang="en">
<main>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<h1>D D D S </h1>
<link rel="stylesheet"href="request.css"/>
</head>
<body>
<div class="field">
<!--name field //-->
<form class="form-request" action="" method="POST" id="myInput>
<label for="inputName" class="sr-only"/>
<input for="name" name="inputName" value="" id="inputName" class="form-control" placeholder="Name" maxlength="16" required autofocus/>
<!--location field //-->
<br/>
<select name="location" onchange='checkvalue(this.value)' required>
<option value="" disabled selected hidden>Delivery Location</option>
<option value="deck">Deck</option>
<option value="grass">Grass</option>
<option value="poolShallow">Pool shallow</option>
<option value="poolDeep">Pool Deep</option>
</select>
<!--drink field //-->
<br/>
<select name="drink" id="drinkChoice" onchange='checkvalue(this.value);' required>
<option value="" disabled selected hidden>Drink Choice</option>
<option value="Slushie A">Slushie A</option>
<option value="Sluishie B">Slushie B</option>
<option value="water">Water</option>
<option value="custom">Custom</option>
</select>
<!--custom field //-->
<input type="text" name="customdrinkfield" id="customdrinkfield" style='display:none;' placeholder="Custom"/>
<!--submit //-->
<button id="btnRequest" type="submit" formvalidate value="Submit">Request</button>
</form>
</div>
<script src="jquery.js"></script>
<script src="jquery.validate.js"></script>
<script type="text/javascript">
jQuery(function ($) {
$('#myInput').validate({
debug: true,
rules: {
customdrinkfield: {
required: function (el) {
return $(el).closest('form').find('#drinkChoice').val() == 'custom';
}
}
}
});
});
function checkvalue(val) {
var element=document.getElementById('çustomdrinkfield');
if(val=="custom")
document.getElementById('customdrinkfield').style.display='block';
else
document.getElementById('customdrinkfield').style.display='none';
}
</script>
</body>
</main>
</html>
Intent cameraIntent = new Intent(
android.provider.MediaStore.ACTION_IMAGE_CAPTURE);
cameraIntent.putExtra(MediaStore.EXTRA_OUTPUT, outputFileUri);
this.startActivityForResult(cameraIntent, 101);