Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset=utf-8 />
<title>Input - Datalist</title>
</head>
<body>
  <input list="categories" type="text">
  <datalist id="categories">
    <option value="Breakfast">Breakfast</option>
    <option value="Brunch">Brunch</option>
    <option value="Lunch">Lunch</option>
    <option value="Dinner">Dinner</option>
    <option value="Desserts">Desserts</option>
  </datalist>
</body>
</html>
 
#categories, input {
  background: red;
  color: white;
}
 
var catVal = document.getElementsByTagName("input")[0],
    cat = document.getElementById("categories");
catVal.style.fontSize = "1.3em";
catVal.addEventListener("focus", function(event){
  $(catVal).dblclick().val("");
}, false);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
ady.ngompro
0viewers