Làm thế nào để hiển thị văn bản trong html5 datalist và không đánh giá cao

<!DOCTYPE html> 
<html> 
<body> 

<input list="browsers" name="browser"> 
<datalist id="browsers"> 
    <option value="Internet Explorer">1</option> 
    <option value="Firefox">2</option> 
    <option value="Chrome">3</option> 
    <option value="Opera">4</option> 
    <option value="Safari">5</option> 
</datalist> 
<input type="submit"> 
</form> 

</body> 
</html>

http://jsfiddle.net/j7ehtqjd/1/Làm thế nào để hiển thị văn bản trong html5 datalist và không đánh giá cao

tôi có kèm theo một fiddle. Hãy kiểm tra. Giải pháp tôi muốn đạt được là khi tôi nhấp vào menu thả xuống giá trị được hiển thị, nhưng tôi muốn văn bản 1,2,3,4,5 được hiển thị. Tôi phải sử dụng một phản ứng json cho vấn đề thực tế của tôi. Chỉ có văn bản sẽ được hiển thị và giá trị sẽ được ẩn như một trình đơn thả xuống chung. Tính năng tự động điền này là cần thiết khác tôi đã có thể đi với thả xuống bình thường.

Nguồn

2014-09-02 Cerebus1504

Bạn có thể di chuyển 'giá trị' sang tham số khác (ví dụ:' giá trị dữ liệu') và đặt 1,2,3,4,5 làm giá trị '. – Regent

Nhưng tôi cần phải gửi giá trị cho phía sau bằng cách sử dụng jquery. – Cerebus1504

Bạn có thể gửi 'data-value' thay vì' value' – Regent

Chỉnh sửa, cập nhật

Sau Regent

Try (v3)

html

<input id="selected" list="browsers" name="browser"> 
<datalist id="browsers"> 
    <option data-value="InternetExplorer" value="1"></option> 
    <option data-value="Firefox" value="2"></option> 
    <option data-value="Chrome" value="3"></option> 
    <option data-value="Opera" value="4"></option> 
    <option data-value="Safari" value="5"></option> 
</datalist> 
<input id="submit" type="submit">

$(document).ready(function() { 

var data = {}; 
$("#browsers option").each(function(i,el) { 
    data[$(el).data("value")] = $(el).val(); 
}); 
// `data` : object of `data-value` : `value` 
console.log(data, $("#browsers option").val()); 


    $('#submit').click(function() 
    { 
     var value = $('#selected').val(); 
     alert($('#browsers [value="' + value + '"]').data('value')); 
    }); 
});

jsfiddle http://jsfiddle.net/guest271314/j7ehtqjd/13/

Nguồn

2014-09-02 06:18:32 guest271314

Cách lấy giá trị và gửi trước đó tôi đã sử dụng để nhập $ ("# trình duyệt"). Val(). – Cerebus1504

@ Cerebus1504 Vâng, có lẽ [fiddle] (http://jsfiddle.net/j7ehtqjd/3/) từ bình luận của câu hỏi của tôi nên được thêm vào để trả lời cho sự hoàn chỉnh của nó – Regent

Ok tôi sẽ cố gắng tôi không nhận được nó – Cerebus1504

Làm thế nào để hiển thị văn bản trong html5 datalist và không đánh giá cao

Trả lời

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