如何在引导工具提示中显示表单元素？

Question

我试图在引导工具提示中显示表单元素，但它不起作用。 工具提示显示任何类型的 html，包括表格和列表，但不显示表单元素，即输入、选择等。

 $(document).ready(function(){ html= '<div><select><option>option1</option><option>option1</option><option>option1</option><option>option1</option><option>option1</option></select></hr><input type="text"/></hr><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="checkbox"/></div>'; $('#example').tooltip({title: html,html:true,placement: "bottom"}); });

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> <div class='list-items'> <span id="example">Test Div</span> </div>

Answer 1

使用工具提示中的sanitize选项，设置为false ...

 $(document).ready(function() { var html = '<div><select><option>option1</option><option>option1</option><option>option1</option><option>option1</option><option>option1</option></select></hr><input type="text"/></hr><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="radio" name="abc"/><input type="checkbox"/></div>'; $('#example').tooltip({ title: html, html: true, placement: "bottom", sanitize: false }); });

 <div class='list-items'> <span id="example">Test Div</span> </div> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>