Tôi có thể có một văn bản hai dòng trong tùy chọn Chọn HTML không? Làm sao?
rtruszk
3,89413 Huy hiệu vàng36 Huy hiệu bạc53 Huy hiệu Đồng13 gold badges36 silver badges53 bronze badges
Hỏi ngày 19 tháng 5 năm 2010 lúc 9:24May 19, 2010 at 9:24
Tôi biết đây là một bài viết cũ hơn, nhưng tôi để lại điều này cho bất kỳ ai khác đến trong tương lai.
Bạn không thể định dạng dòng chia thành một tùy chọn; Tuy nhiên, bạn có thể sử dụng tiêu đề Attibute để cung cấp một chú giải công cụ hỗ trợ chuột để cung cấp thông tin đầy đủ. Sử dụng một mô tả ngắn trong văn bản tùy chọn và cho toàn bộ skinny trong tiêu đề.
1
Dai
Huy hiệu vàng 134K2525 gold badges235 silver badges342 bronze badges
Đã trả lời ngày 8 tháng 7 năm 2012 lúc 16:08Jul 8, 2012 at 16:08
2
Không, trình duyệt không cung cấp tùy chọn định dạng này.
Bạn có thể có thể giả mạo nó với một số hộp kiểm với
function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
1 và JS để biến nó thành một menu bay ra.Đã trả lời ngày 19 tháng 5 năm 2010 lúc 9:25May 19, 2010 at 9:25
QuentinentinQuentin
883K121 Huy hiệu vàng1180 Huy hiệu bạc1298 Huy hiệu đồng121 gold badges1180 silver badges1298 bronze badges
0
Làm thế nào về việc đặt văn bản dài vào một
function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
2 khác ngay bên dưới và vô hiệu hóa nó? Có thể là một cách giải quyết cho một người nào đó nên đăng ở đây.
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
Đã trả lời ngày 24 tháng 6 năm 2016 lúc 21:36Jun 24, 2016 at 21:36
joym8joym8joym8
3.7273 huy hiệu vàng45 Huy hiệu bạc87 Huy hiệu đồng3 gold badges45 silver badges87 bronze badges
Một chút hack, nhưng điều này mang lại hiệu quả của một lựa chọn đa dòng, đặt BGColor màu xám cho dòng đa dòng của bạn và nếu bạn chọn bất kỳ văn bản màu xám nào, nó sẽ chọn bản đầu tiên của nhóm. Kinda Clever tôi muốn nói :] Tùy chọn đầu tiên cũng cho thấy cách bạn có thể đặt thẻ tiêu đề cho một tùy chọn.
function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
Yes
No
This is my description for the no option
This is line 2 for the no option
Maybe
This is my description for Maybe option
This is line 2 for the Maybe option
This is line 3 for the Maybe option
Brasofilo
25.1K15 Huy hiệu vàng90 Huy hiệu bạc177 Huy hiệu đồng15 gold badges90 silver badges177 bronze badges
Đã trả lời ngày 18 tháng 11 năm 2014 lúc 21:01Nov 18, 2014 at 21:01
Brianbrianbrian
Huy hiệu Huy hiệu Bạc 19111 silver badge2 bronze badges
1
Mã HTML
Test of select menu [SelectboxIt plugin]
Option 1
Option 2
Option 3
Option 4
Option 5
Option 6
Option 7 with a really, really long text line that we shall use in order to test the wrapping of text within an option or optgroup
Option 8
Option 9
Option 10
Mã JavaScript
$[function[]{
$["#testselectset"].selectBoxIt[{
theme: "default",
defaultText: "Make a selection...",
autoWidth: false
}];
}];
Mã CSS
.selectboxit-container .selectboxit, .selectboxit-container .selectboxit-options {
width: 400px; /* Width of the dropdown button */
border-radius:0;
max-height:100px;
}
.selectboxit-options .selectboxit-option .selectboxit-option-anchor {
white-space: normal;
min-height: 30px;
height: auto;
}
Và bạn phải thêm một số thư viện jQuery chọn hộp JQuery CSS
JQuery ui min js
SelectBox JS
Vui lòng kiểm tra liên kết này liên kết jsfiddle
Đã trả lời ngày 6 tháng 4 năm 2015 lúc 12:07Apr 6, 2015 at 12:07
ArjunarjunArjun
7951 Huy hiệu vàng7 Huy hiệu bạc18 Huy hiệu đồng1 gold badge7 silver badges18 bronze badges
1
Nếu bạn đang sử dụng select2, bạn có thể dễ dàng xây dựng một cái gì đó để phù hợp với các tùy chọn thả xuống và tùy chọn được chọn bên dưới:
Khi tùy chọn văn bản của bạn được chia bởi function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
3
function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
Pacheco|Fmcia Pacheco|11443322551
Sau đó, kịch bản của bạn có thể giống như thế này:
function formatSearch[item] {
var selectionText = item.text.split["|"];
var $returnString = $['' + selectionText[0] + '' + selectionText[1] + '' + selectionText[2] +''];
return $returnString;
};
function formatSelected[item] {
var selectionText = item.text.split["|"];
var $returnString = $['' + selectionText[0].substring[0, 21] +''];
return $returnString;
};
$['.select2'].select2[{
templateResult: formatSearch,
templateSelection: formatSelected
}];
Kết quả bạn có thể thấy dưới đây:
Đã trả lời ngày 1 tháng 2 năm 2020 lúc 21:53Feb 1, 2020 at 21:53
3
Bạn có thể sử dụng phần tử đầu vào bình thường với thuộc tính danh sách, sau đó thêm các tùy chọn có giá trị, giá trị sẽ được hiển thị dưới dạng dòng đầu tiên và văn bản tùy chọn sẽ được hiển thị tự động dòng thứ hai. Tôi tìm thấy giải pháp này, có một cái nhìn, cách này cũng có thể giúp
Customer List
Aw Trucks Limited
Acorn Stoneworx Limited
Pacheco Fmcia Pacheco
Nhưng điều này chỉ hoạt động trong Chrome, các trình duyệt khác không hiển thị văn bản giá trị.
Đã trả lời ngày 13 tháng 4 năm 2021 lúc 5:56Apr 13, 2021 at 5:56
Chỉ tạo kiểu cho kiểm soát chọn như thế này:style the select control like this:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
0Result:
Đã trả lời ngày 25 tháng 5 năm 2021 lúc 20:43May 25, 2021 at 20:43
1
Không hoạt động đầy đủ [phần HR Line] trên tất cả các trình duyệt, nhưng đây là giải pháp:hr line part] on all browsers, but here is the solution:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
1Đã trả lời ngày 26 tháng 12 năm 2016 lúc 22:49Dec 26, 2016 at 22:49
Thay vào đó, có thể thử thay thế chọn bằng đánh dấu, ví dụ:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
2
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
3
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
4Đã trả lời ngày 17 tháng 10 năm 2017 lúc 18:06Oct 17, 2017 at 18:06
RogerrogerrogergerRogerRoger
3863 Huy hiệu bạc9 Huy hiệu Đồng3 silver badges9 bronze badges
1
Ok, tôi đã tìm thấy một giải pháp:
HTML:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
5CSS:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
6jQuery:
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
7Đã trả lời ngày 22 tháng 3 năm 2020 lúc 12:36Mar 22, 2020 at 12:36
user3267302user3267302user3267302
1733 Huy hiệu bạc13 Huy hiệu Đồng3 silver badges13 bronze badges
Bạn có thể sử dụng một thư viện có tên SELECT2
Bạn cũng có thể nhìn vào câu hỏi & câu trả lời của Stackoverflow
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
8Trong JavaScript
My real option text
[...and my really really long option text that is basically a continuation of previous option]
[...and still continuing my previous option]
Another real option text
9Đã trả lời ngày 23 tháng 5 năm 2020 lúc 18:47May 23, 2020 at 18:47
Một ý tưởng có thể là sử dụng Optgroup. Trong trường hợp của tôi thấy nó tốt hơn cách tiếp cận khuyết tật. Tôi nghĩ rằng nó ít khó hiểu hơn so với việc nhìn thấy tùy chọn bị vô hiệu hóa mà tôi nghĩ.
function SelectFirst[SelVal] {
var arrSelVal = SelVal.split[","]
if [arrSelVal.length > 1] {
Valuetoselect = arrSelVal[0];
document.getElementById["select1"].value = Valuetoselect;
}
}
0Một thành phần bên ngoài nghe có vẻ mát mẻ như Vue Chọn, nhưng tôi muốn gắn bó với HTML tự nhiên chọn vào lúc này.
Đã trả lời ngày 10 tháng 12 năm 2020 lúc 15:38Dec 10, 2020 at 15:38
Có, bằng cách sử dụng CSS Styles Space White không gian: Mang trước; Trong lớp .Dropdown của bootstrap bằng cách ghi đè nó. Trước đó nó là không gian trắng: Nowrap; Vì vậy, nó làm cho thả xuống được bọc thành một dòng. Bao bọc trước làm cho nó theo chiều rộng.
Đã trả lời ngày 12 tháng 9 năm 2017 lúc 13:51Sep 12, 2017 at 13:51
AsteriskasteriskisAsterisk
1291 Huy hiệu bạc11 Huy hiệu đồng1 silver badge11 bronze badges
0