Postingan lainnya
Cara menggabungkan dua kata di javascript
Hallo semuanya! di sini saya baru saja menonton playlist sekolahkoding membuat bot terminal, dan langsung saya praktekan.
Jadi di sini saya menambahkan fitur google search.
Kode :
<!DOCTYPE html>
<html>
<head>
<title>Online Bot Terminal</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet">
</head>
<style>
body {
background:black;
color:white;
font-family: 'JetBrains Mono',sans serif;
}
::selection {
background:white;
color:black;
}
#terminal {
font-size:12px;
}
.user_input {
width:60%;
}
</style>
<body>
<h6 align="center">===============================================</h6>
<p align="center">Welcome To Online Bot</p>
<hr>
<p>
Command :
</p>
<div class="command">
<p>
-help <font color="red"> [ Semua Command ]</font>
</p>
<p>
-about <font color="red">[ About Creator ]</font>
</p>
<hr></div>
<br>
<div id="terminal">
<span>root@cli~# </span><input type="text" class="user_input" placeholder="_" style="background:transparent;border:none;outline:none; color:white;" autofocus="autofocus"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$("#terminal").on('keyup', '.user_input', function(e){
if(e.keyCode == 13){
$(this).attr("disabled","disabled");
var values = $(this).val().trim().split(" ");
if(values == ''){
appendResponse("Command Not!");
} else {
if(values[0] == 'open'){
openLink(values[1]);
} else {
if(values[0] == 'Sapa'){
name(values[1]);
} else {
if(values[0] == 'GS'){
console.log(gsearch(values[1]+values[2]+values[3]));
} else {
appendResponse("Bash Command Not Found!");
}
}
}
}
appendInput();
}
});
// Menampilkan Response
function appendResponse( message ){
$("#terminal").append("<div class='bot_output'>" + message + "</div>");
}
function appendInput(){
$("#terminal").append("<span>root@cli~# </span><input type='text' class='user_input' placeholder='_' style='background:transparent;border:none;outline:none; color:white;' autofocus='autofocus'>");
}
function openLink(link){
window.open(link,'_blank');
}
function name(nama){
$("#terminal").append("<div class='bot_output'>Hallo " + nama + "!</div>");
}
function gsearch(key){
var url = ('https://www.google.com/search?q='+ key );
window.open(url,'_blank');
}
</script>
</body>
</html>
Yang jadi masalah adalah ketika saya ingin mencoba fitur google search dengan command GS [ Yang ingin Di Search]
Nah, ketika saya coba GS Apa Itu Programming?
dan berhasil membuka di tab baru, tapi yang hanya di ambil di bagian Apa saja yang masuk ke google search dan "Itu programming" tidak masuk ke google search,
jadi saya coba tambahkan seperti ini :
values[1]+values[2]+values[3]
Ternyata berhasil mengambil tiga kata, tapi kalau yang di search hanya satu kata sisanya hanyalah undefined, contoh : GS Programming
dan yang di buka google search "Programmingundefinedundefined"
seperti itu,
jadi gimana cara menggabungkan spasi di replace menjadi tanda " + " ?
1 Jawaban:
Jawaban Terpilih
<div>Mungkin bisa dicoba seperti ini :</div><pre><!DOCTYPE html> <html> <head> <title>Online Bot Terminal</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet"> </head> <style> body { background:black; color:white; font-family: 'JetBrains Mono',sans serif; } ::selection { background:white; color:black; } #terminal { font-size:12px; } .user_input { width:60%; } </style> <body> <h6 align="center">===============================================</h6> <p align="center">Welcome To Online Bot</p> <hr> <p> Command : </p> <div class="command"> <p> -help <font color="red">&nbsp;[ Semua Command ]</font> </p> <p> -about <font color="red">[ About Creator ]</font> </p> <hr></div> <br> <div id="terminal"> <span>root@cli~# </span><input type="text" class="user_input" placeholder="" style="background:transparent;border:none;outline:none; color:white;" autofocus="autofocus"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $("#terminal").on('keyup', '.user_input', function(e){ if(e.keyCode == 13){ $(this).attr("disabled","disabled"); var values = $(this).val().trim().split(" "); if(values == ''){ appendResponse("Command Not!"); } else { if(values[0] == 'open'){ openLink(values[1]); } else { if(values[0] == 'Sapa'){ name(values[1]); } else { if(values[0] == 'GS'){ let userInput = $(".user_input").val().split(" "); //Konversi nilai user input ke bentuk array userInput.shift(); //Remove (Hapus) array dengna index pertama, yaitu "GS" keywordSearch = userInput.join(" "); //Join array sisanya (teks setelah kata GS) dengan spasi console.log(gsearch(keywordSearch)); } else { appendResponse("Bash Command Not Found!"); } } } } appendInput(); } }); // Menampilkan Response function appendResponse( message ){ $("#terminal").append("<div class='bot_output'>" + message + "</div>"); } function appendInput(){ $("#terminal").append("<span>root@cli~# </span><input type='text' class='user_input' placeholder='' style='background:transparent;border:none;outline:none; color:white;' autofocus='autofocus'>"); } function openLink(link){ window.open(link,'_blank'); } function name(nama){ $("#terminal").append("<div class='bot_output'>Hallo " + nama + "!</div>"); } function gsearch(key){ var url = ('https://www.google.com/search?q='+ key ); window.open(url,'_blank'); } </script> </body> </html></pre><div><br>Hasilnya bisa di cek disini : <a href="https://jsbin.com/vabacohole/edit?html,console,output">https://jsbin.com/vabacohole/edit?html,console,output</a><br><br>Semoga membantu! </div>
Tanggapan
Makasih mas, berhasil..