Văn bản trong Trường HTML biến mất khi được nhấp?

Question

Tôi có thể dễ dàng tạo trường nhập html có văn bản đã có trong đó. Nhưng khi người dùng nhấp vào trường nhập văn bản không biến mất nhưng vẫn ở đó. Sau đó, người dùng phải xóa văn bản theo cách thủ công. Làm thế nào tôi có thể tạo ra một lĩnh vực đầu vào, nơi khi người dùng nhấp vào hộp lĩnh vực đầu vào văn bản sau đó biến mất?

Answer 1

Làm thế nào về một cái gì đó như thế này?

<input name="myvalue" type="text" onfocus="if(this.value=='enter value')this.value='';" onblur="if(this.value=='')this.value='enter value';">

này sẽ xóa khi tập trung lần đầu tiên, nhưng sau đó sẽ không rõ ràng về trọng tâm tiếp theo sau khi người dùng nhập vào giá trị của họ, khi để trống nó khôi phục các giá trị nhất định.

Answer 2

Để thực hiện điều đó, bạn có thể sử dụng hai sự kiện onfocus và onblur:

<input type="text" name="theName" value="DefaultValue" 
    onblur="if(this.value==''){ this.value='DefaultValue'; this.style.color='#BBB';}" 
    onfocus="if(this.value=='DefaultValue'){ this.value=''; this.style.color='#000';}" 
    style="color:#BBB;" /> 

Answer 3

Những gì bạn muốn làm là sử dụng thuộc tính HTML5 placeholder cho phép bạn đặt một giá trị mặc định cho hộp đầu vào của bạn:

<input type="text" name="inputBox" placeholder="enter your text here">

Điều này sẽ đạt được những gì bạn đang tìm kiếm. Tuy nhiên, hãy cẩn thận vì thuộc tính giữ chỗ không được hỗ trợ trong Internet Explorer 9 và các phiên bản cũ hơn.

Answer 4

hãy thử cái này.

<label for="user">user</label> 
<input type="text" name="user" 
onfocus="if(this.value==this.defaultValue)this.value=''"  
onblur="if(this.value=='')this.value=this.defaultValue" 
value="username" maxlength="19" /> 

hy vọng điều này sẽ hữu ích.

Answer 5

này cũng đơn giản tôi nghĩ rằng giải pháp đó phải giải quyết tất cả các vấn đề của bạn:

<input name="myvalue" id="valueText" type="text" value="ENTER VALUE"> 

Đây là nút gửi của bạn:

<input type="submit" id= "submitBtn" value="Submit"> 

sau đó đặt jQuery nhỏ này trong một file js:

//this will submit only if the value is not default 
$("#submitBtn").click(function() { 
    if ($("#valueText").val() === "ENTER VALUE") 
    { 
     alert("please insert a valid value"); 
     return false; 
    } 
}); 

//this will put default value if the field is empty 
$("#valueText").blur(function() { 
    if(this.value == ''){ 
     this.value = 'ENTER VALUE'; 
    } 
}); 

//this will empty the field is the value is the default one 
$("#valueText").focus(function() { 
    if (this.value == 'ENTER VALUE') { 
     this.value = ''; 
    } 
}); 

Và nó cũng hoạt động trong các trình duyệt cũ hơn. Plus nó có thể dễ dàng được chuyển đổi sang javascript bình thường nếu bạn cần.

Answer 6

đơn giản như thế này: <input type="text" name="email" value="e-mail..." onFocus="this.value=''">