Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / html

Efek Melakukan Cut Elemen HTML Menggunakan Atribut OnCut

Dipublikasikan Oleh: elfanmauludi 5 komentar
Atribut oncut pada html adalah atribut yang dapat diaktifkan ketika user melakukan cut atau delete pada konten yang telah ditampilkan pada elemen. Atribut oncut merupakan atribut jenis boolean yang hanya terdiri dari dua kondisi yaitu True atau False yang didukung penggunaannya oleh segala jenis elemen pada html, tetapi atribut oncut tidak dapat digunakan jika pada elemen tersebut telah mengandung atribut ContentEditable yang disetting dalam tipe true.


Sebelum memahami lebih dalam materi tentang Efek Melakukan Cut Elemen HTML Menggunakan Atribut OnCut, terlebih dahulu pelajari materi tentang: Efek Melakukan Copy HTML Menggunakan Atribut OnCopy, Efek Melakukan Scroll Mouse HTML Menggunakan Atribut OnScroll, dan Atribut Event OnDrop HTML dan Fungsinya.

Catatan: terdapat tiga cara untuk melakukan cut pada konten elemen html.
  • Menekan CTRL + X.
  • Pilih "CUT" pada bagian menu Edit browser.
  • Klik nakan dan pilih perintah "Cut".

Sintak: <element oncut = "script">

Value Atribut: merupakan bagian dari atribut event yang dapat digunakan pada jenis elemen apapun pada html, dimana script perintah dapat berjalan ketika atribut oncut tersebut dipanggil.


Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

atribut oncut

</title>

 

<style>

body 

{

text-align:center;}

 

h1 

{

color:green;}

</style>

</head>

 

<body>

 

<h1>

Blog Elfan

</h1>

 

<h2>

atribut oncut pada 

elemen input

</h2>

 

<input 

type = "text" 

oncut = "potong()"

value = "Blog TIk: merupakan portal ilmu komputer">

 

<p id = "sudo"></p>

 

<script>

function potong() 

{

document.getElementById("sudo").innerHTML = "Cut the text!";

}

</script>

 

</body>

 

</html>

Output:

Blog Elfan

atribut oncut pada elemen input


Contoh: 

<!DOCTYPE html>

<html>

 

<head>

<title>

atribut oncut

</title>

 

<style>

body 

{

text-align:center;}

 

h1 

{

color:green;}

</style>

</head>

 

<body>

 

<h1>

Blog Elfan

</h1>

 

<h2>

atribut oncut pada elemen input

</h2>

 

<p 

contenteditable = "true" 

oncut = "potong()">

Blog TIK: portal ilmu komputer.

</p>

 

<script>

function potong() 

{

alert("Cut the text!");

}

</script>

 

</body>

 

</html>

Output:

Blog Elfan

atribut oncut pada elemen input

Blog TIK: portal ilmu komputer.


Artikel ini didedikasikan kepada: Sulthan Afkar Aisy, Vivi Lestiyani, Ahmad Syahrul Setiawan, Alfin Lis Priyadi, dan Andan Arum Anggita Daneswari.
Location: Semarang, Kota Semarang, Jawa Tengah, Indonesia

5 komentar untuk "Efek Melakukan Cut Elemen HTML Menggunakan Atribut OnCut"

  1. AnonimJumat, 22 Oktober 2021 pukul 18.59.00 WIB

    Apa yang dimaksud dengan atribut oncut pada elemen html?

    BalasHapus
    Balasan
    1. AnonimJumat, 22 Oktober 2021 pukul 18.59.00 WIB

      Atribut oncut pada html merupakan jenis atribut yang diaktifkan ketika user memotong konten dari suatu elemen.

      Catatan: atribut oncut pada umumnya digunakan pada elemen input dengan tipe teks.

      Hapus
    2. AnonimJumat, 22 Oktober 2021 pukul 19.03.00 WIB

      Atribut oncut merupakan jenis atribut yang akan mengaktifkan event tertentu pada brower ketika user atau pengguna browser melakukan proses cut pada konten.

      Hapus
  2. AnonimJumat, 22 Oktober 2021 pukul 19.01.00 WIB

    Jenis browser apa saja yang dapat digunakan untuk mengaktifkan atribut oncut pada elemen html?

    BalasHapus
    Balasan
    1. AnonimJumat, 22 Oktober 2021 pukul 19.02.00 WIB

      Berikut adalah beberapa contoh browser populer yang dapat digunakan untuk mengaktifkan atribut oncut pada lemen html:
      1. Google Chrome
      2. Internet Explorer
      3. Firefox
      4. Opera
      5. Safari

      Hapus

Hubungi admin melalui Wa : +62-896-2414-6106

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.

Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.

- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -