Đây là hộp chọn của tôi:Gỡ bỏ "mặc định" <option> trong một hộp chọn

<select id="category"> 
    <option value="">Pick a choice!</option> 
    <option value="">choice1</option> 
    <option value="">choice2</option> 
    <option value="">choice3</option> 
    <option value="">choice4</option> 
</select>

Tôi muốn các tùy chọn Pick a choice! phải được loại bỏ khi nhấp chuột sử dụng trên hộp chọn. Nếu người dùng nhấp vào bất kỳ nơi nào khác, tùy chọn Pick a choice! sẽ quay lại. Tôi không muốn người dùng có thể chọn tùy chọn Pick a choice!. Tôi nên làm gì?

2012-01-31 Charles Lemarier

Bạn sẽ cần phải sử dụng JavaScript. Bạn có thể muốn xem xét sử dụng một thư viện JS, chẳng hạn như [tag: jquery], [tag: mootools], [tag: scriptaculous] ... –

Bạn cần phải viết một số Javascript để đạt được điều này. –

Bản sao của http://stackoverflow.com/questions/5805059/select-placeholder ?? – craig1231

Nếu không có một số PHP hoặc JavaScript để xóa tùy chọn động bạn có một tùy chọn rất đơn giản khác mà tôi sử dụng thường xuyên, đây là tùy chọn disabled="disabled". Tùy chọn sẽ vẫn còn nhưng người dùng sẽ không thể thực sự chọn tùy chọn đó.

Sự thất bại với điều này là nếu ai đó chỉ gửi biểu mẫu mà không chọn bất kỳ giá trị trống nào sẽ gửi trong biểu mẫu, nhưng đây là nơi xử lý xác thực của bạn được phát.

Mã của bạn cho "Chọn lựa chọn!" tùy chọn sẽ trông giống như thế này:

<option disabled="disabled">Pick a choice!</option>

Tôi hy vọng nó giúp.

Nguồn

2012-01-31 19:36:46 Ryan

tôi đã tìm thấy câu trả lời này trước đó, nhưng nó không phải là đủ. "chọn một lựa chọn!" cần phải được loại bỏ hoàn toàn Tôi đang cố gắng một cái gì đó trong JQuery để đặt nó trong hiển thị: không có; đăng câu trả lời sớm. Thx để được giúp đỡ của bạn! –

Tôi đánh giá cao phản hồi của Charles, chỉ là một mẹo cho tương lai, nếu bạn đang tìm kiếm các tùy chọn tốt nhất để liệt kê các ngôn ngữ bạn đang làm việc, tốt nhất là liệt kê chúng trong các thẻ nhưng thậm chí được viết trong câu hỏi là OK. Lý do là tôi có một số giải pháp với PHP mà tôi có thể viết mà không cần suy nghĩ, có những người khác như thế với JS và jQuery. Lưu ý cách mà không ai trả lời bạn bằng jQuery - chỉ là một bình luận với gợi ý để thử nó, nó rất lớn vì bạn không gắn thẻ nó như là chấp nhận được trong câu trả lời của bạn, cộng với không có lần thử trước nào được hiển thị với jQuery. Chúc may mắn – Ryan

-1

$ ("# Tùy chọn SelectID: đầu tiên"). Remove();

Nguồn

2012-09-10 04:16:09

Đây là một số giải pháp. Không biết thời tiết này là bộ yêu cầu của bạn. Chỉ

<html> 
<head> 
<title>Untitled Document</title> 
<script> 
function doremove() 
{ 

    var obj=document.getElementById("category"); 
    obj.remove(0); 
} 

function addOpt() 
{ 
var obj=document.getElementById("category"); 
var option=document.createElement("option"); 
option.text="Pick a choice!"; 
option.value = 0; 
obj.add(option,1); 
obj.value = 0; 
} 
</script> 
</head> 

<body> 
<select id="category" onfocus="doremove();" onblur="addOpt();"> 
    <option value="0">Pick a choice!</option> 
    <option value="">choice1</option> 
    <option value="">choice2</option> 
    <option value="">choice3</option> 
    <option value="">choice4</option> 
</select> 
<input type="text" /> 
</body> 
</html>

Nguồn

2012-12-19 05:33:27

CSS Sol'n

Vì vậy, tôi biết bài này là khá cũ bây giờ, nhưng một css chỉ giải pháp đã không được cung cấp ... Phần lớn hiệu quả hơn cách thực hiện điều này. Lưu ý rằng <option> đầu tiên không có thuộc tính giá trị; điều này cho phép nó có hiệu quả.

#category:focus option:first-of-type { 
 
    display: none; 
 
}

<select id="category"> 
 
    <option>Pick a choice!</option> 
 
    <option value="choice1">choice1</option> 
 
    <option value="choice2">choice2</option> 
 
    <option value="choice3">choice3</option> 
 
    <option value="choice3">choice4</option> 
 
</select>

Nguồn

2014-10-10 03:51:50 Todd

Cảm ơn bạn. tôi không nghĩ câu trả lời như thế này. –

Bạn được chào đón, tôi nghĩ vậy. – Todd

Gỡ bỏ "mặc định" <option> trong một hộp chọn

Trả lời

CSS Sol'n

Các vấn đề liên quan