追加單選按鈕 - 引導格式不同

我使用jQuery到單選按鈕添加到窗體的文本，我注意到，相對於標記在HTML中一個單選按鈕時，按鈕上的文字被格式化大膽（，或一般文字）。追加單選按鈕 - 引導格式不同

請注意，當我將Bootstrap庫註釋掉時，不會發生此行爲。

如何強制文本保持未格式化？

<!DOCTYPE html> 
 
<html lang="en" xmlns:background-color="http://www.w3.org/1999/xhtml"> 
 

 
    <head> 
 
     <meta charset="utf-8"> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    </head> 
 

 
    <body> 
 
     <div>Normal text</div> 
 
     <form id="myJSForm" ></form> 
 
     <form id="myNormalForm"> 
 
      <input type="radio">myNormalForm</input> 
 
     </form> 
 
    </body> 
 

 
    <script> 
 
     var myRadioButton = $('<input>',{ 
 
      type: 'radio', 
 
      name: 'myRadio', 
 
      value: 'myRadio' 
 
     }); 
 

 
     $('<label>', { 
 
      insertAfter:'#myJSForm', 
 
      append: [myRadioButton, 'myJSForm'] 
 
     }); 
 
    </script> 
 

 
</html>

來源

2017-06-01 GlaceCelery

標籤的更改CSS爲：

label { font-weight:400!important; }

來源

2017-06-01 02:07:48

另一種插入input元素

<!DOCTYPE html> 
 
<html lang="en" xmlns:background-color="http://www.w3.org/1999/xhtml"> 
 

 
    <head> 
 
     <meta charset="utf-8"> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    </head> 
 

 
    <body> 
 
     <div>Normal text</div> 
 
     <form id="myJSForm" ></form> 
 
     <form id="myNormalForm"> 
 
      <input type="radio">myNormalForm</input> 
 
     </form> 
 
    </body> 
 

 
    <script> 
 
     var myRadioButton = '<input type="radio">myJSForm</input>' 
 

 
     $('#myJSForm').append(myRadioButton); 
 
    </script> 
 

 
</html>

和

來源

2017-06-01 02:12:22 Mark

感謝。有沒有辦法使用「創建元素+指定屬性」方法來做到這一點？代碼讀起來更容易 – GlaceCelery

追加單選按鈕 - 引導格式不同

回答

相關問題