0
入力フィールドが空であるかどうかを確認しています。空の場合はメッセージを表示するボタン（google検索）を表示します。ボタン（レコードの更新）とメッセージ。入力フィールドの値に対応するブートストラップボタンを動的に作成する方法
マイ要素：
- 入力フィールド
- ボタン1（フィールドが空である====>検索）
- ボタン2（フィールドが空ではない====>更新情報）
現在、私はinspect要素で作成した2つのボタンを見ることができ、非常に悪く見えます。
以下のコードを複製しました。ありがとうございます！
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
/* #googlesearch{display:none;}
#updateinformation{display:none;}
#emptyform{display:none;} */
</style>
</head>
<body>
<div class="container">
<div class="form-group">
<label >Company name:</label>
<input onload="checker()" onkeydown="checker()" onchange="checker()" onkeyup="checker()" onfocus="checker()" class="form-control" id="txtcompany" value="dgfsd" >
<div id="txtinformator">
<small id="emptyform">Your form is empty, we recommend </small><br/>
<button id="googlesearch" class="btn btn-xs btn-primary">Search on Google</button>
<button id="updateinformation" class="btn btn-xs btn-success">Update Information</button>
</div>
</div>
</div>
<script>
$(document).ready(function() {
$('#googlesearch').hide();
$('#updateinformation').hide();
$('#emptyform').hide();
});
// $(document).ready(function() {
// if($('#txtcompany').val() == ""){
// $('#googlesearch').show();
// $('#emptyform').show();
// }
// else if (!$('#txtcompany').val()){
// $('#updateinformation').show();
// }
// else {
// $('#googlesearch').hide();
// $('#emptyform').hide();
// }
// });
function checker(){
if($('#txtcompany').val().length === 0){
$('#updateinformation').hide();
$('#googlesearch').show();
$('#emptyform').show();
}
else if (!$('#txtcompany').val()){
$('#updateinformation').hide();
}
else {
$('#emptyform').text('We suggest that you update this information.');
$('#updateinformation').show();
$('#googlesearch').hide();
}
}
</script>
</body>
</html>
機能チェッカー（）{ VAR SearchonGoogle =のdocument.createElement（ 'ボタン'）を作成するためにJavaScriptを使用することができます。 var UpdateInformation = document.createElement（ 'button'）; var CompanyField = document.getElementById（ 'txtcompany'）; if（CompanyField.value == '）{ SearchonGoogle.innerText =' Googleで検索 '; document.getElementById（ 'CompanyVerification'）。appendChild（SearchonGoogle）; } else { SearchonGoogle.innerText = '情報を更新'; document.getElementById（ 'CompanyVerification'）。appendChild（SearchonGoogle）; } – 64YearOldCoder