2012-06-26 31 views
13

Tôi đang sử dụng chú giải công cụ từ gói Twitter Bootstrap để hiển thị các thông tin về mặt hàng trên trang. Đôi khi thông tin được thay đổi và cần được cập nhật trong chú giải công cụ. Tôi đã cố gắng đơn giản hóa lại chú giải công cụ với tiêu đề mới:Làm cách nào để ghi đè lên chú giải công cụ khởi động twitter?

$('#selector').tooltip({ title: 'new text'}); 

Tuy nhiên tiêu đề của tooltip không bị thay đổi với văn bản mới. Nó vẫn giữ nguyên như ban đầu. Bất kỳ ý tưởng tại sao, và có bất kỳ công việc xung quanh? Cảm ơn!

+0

hãy thử cách này: $ (elm) .tooltip ('tiêu diệt'). Tooltip(). Tooltip ('show'); – Aliti

Trả lời

14

Cập nhật: Như đã chỉ ra bởi @ Nigel-Angel, TWBS v3 sử dụng data('bs.tooltip')


Bạn không có thể ghi đè các đối tượng tooltip khi bạn đã khởi tạo nó trên một phần tử. Nhưng bạn có thể xóa nó và làm lại.

Thử xóa và sau đó khởi động lại chú giải công cụ với tất cả các tùy chọn của bạn (nếu bạn có bất kỳ tùy chọn nào).

$('#selector').data('tooltip',false)   // Delete the tooltip 
       .tooltip({ title: 'new text'}); 

Có thể cần phải xóa người nghe nhưng hoạt động như vậy.

+0

Tuyệt vời, chính xác những gì tôi cần. Cảm ơn rất nhiều! – bbbonthemoon

+2

@bbbonthemoon Chỉ cần tình cờ khi đăng bài này: http://stackoverflow.com/a/9875490/1478467 mà có thể được sạch hơn – Sherbrow

+0

Điều này làm việc tuyệt vời, không cần phải chỉnh sửa người nghe ở tất cả. –

2

Vì một số lý do, điều này không hiệu quả đối với tôi (bootstrap 2.1.1). Những gì tôi phải làm là:

$('#element').tooltip('destroy'); 
    $("#element").tooltip({'placement':'right', 'title':'larger larger text title'}); 
    $("#element").tooltip('show'); 
+0

Đây là những gì làm việc cho tôi. Tôi đã sử dụng hai chú giải công cụ hoàn toàn khác nhau dựa trên ngữ cảnh của giao diện người dùng. Cảm ơn bạn @aszahran. – Hallmanac

6

Kỹ thuật này không làm việc cho tôi vì vậy tôi tìm thấy một câu trả lời, ẩn trong một trong những ý kiến ​​of a similar question.

cách sạch để cập nhật các văn bản hiển thị của tooltip

$(element).attr('title', 'NEW_TITLE').tooltip('fixTitle').tooltip('show');

Cảm ơn bạn lukmdo

0

@Sherbrow Bạn có thể sử dụng đơn giản nhất one.Need không đi giải pháp phức tạp này. Đây là mã mẫu.

$('#spanUsername').prop('title', newValue);  
0

Tôi sử dụng bootstrap 3 và không cách nào trong số này hiệu quả với tôi mà không có lỗi. Hủy bỏ chú giải công cụ thông qua .tooltip('destroy') và tạo lại nó trong cùng một chức năng .tooltip({...}) sẽ dẫn đến chú giải công cụ không còn hoạt động nữa. Nó chỉ hoạt động nếu cuộc gọi giải trí được thực hiện sau, sau khi cuộc gọi hủy đã hoàn thành công việc của nó một cách không đồng bộ (do đó tại sao giải trí ngay lập tức bị ghi đè).

Các đề xuất để hủy dữ liệu nội bộ .data('tooltip',false) không hoạt động. Thứ nhất, với bootstrap 3, nó sẽ là data('bs.tooltip, false) và khi được gọi, nếu chú giải công cụ hiện được hiển thị, nó sẽ làm rò rỉ nó và để nó hiển thị vĩnh viễn. Chú giải công cụ mới sẽ hiển thị và ẩn trên đầu trang của nó.

giải pháp cuối cùng của tôi là:

$x.tooltip('hide'); 
$x.data('bs.tooltip', false); 
$x.tooltip({ ... }) // recreate it 

Lưu ý rằng cũng thay đổi tiêu đề thông qua .attr('title', '...') và giải pháp tương tự và gọi .tooltip('fixupTitle') làm việc - nhưng loại bỏ các placement tùy chọn và khả năng cũng là lựa chọn khác, và thực hiện một tooltip đó được đặt ở đầu phần tử chứ không phải ở bên phải, như ban đầu.Nó thậm chí có thể đã có một số lỗi khác được liệt kê ở trên, nhìn thấy trong các biến thể khác của giải pháp này, nhưng tôi đã không nhìn nhiều hơn nữa.

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