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 :
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 :
dan yang di buka google search "Programmingundefinedundefined"
seperti itu,
jadi gimana cara menggabungkan spasi di replace menjadi tanda " + " ?
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 " + " ?
atau respon:
Jawaban Terpilih
Mungkin bisa dicoba seperti ini :
Hasilnya bisa di cek disini : https://jsbin.com/vabacohole/edit?html,console,output
Semoga membantu!
<!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'){
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>Hasilnya bisa di cek disini : https://jsbin.com/vabacohole/edit?html,console,output
Semoga membantu!
614 Kontribusi 357 Poin
Jawaban
Mungkin bisa dicoba seperti ini :
Hasilnya bisa di cek disini : https://jsbin.com/vabacohole/edit?html,console,output
Semoga membantu!
<!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'){
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>Hasilnya bisa di cek disini : https://jsbin.com/vabacohole/edit?html,console,output
Semoga membantu!
Login untuk gabung berdiskusi
Pertanyaan Lainnya
Top Kontributor
- @dianarifr
642 Kontribusi 316 Poin
- @Nandar
627 Kontribusi 197 Poin
- @ahanafi
614 Kontribusi 357 Poin
- @Saputroandhi
509 Kontribusi 162 Poin
- @Dodi Sitorus
412 Kontribusi 145 Poin