我使用的语言切换内置在HTML,CSS,JS,jQuery ...我是新的JS/jQuery,不知道如何添加链接到下拉菜单语言。每个子菜单都链接到其他语言版本的网站。
有人能给点建议吗?拜托?
超文本:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
<link href="../dist/css/flags.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.js"></script>
<link rel="stylesheet" href="https://smsverificator.com/assets/css/language_switcher_style.css">
</head>
<body onload="prettyPrint()">
<div class="col-xs-12 col-md-6">
<form>
<div class="form-group">
<label>Select Language</label><br>
<div id="options"
data-input-name="country2"
data-selected-country="US">
</div>
</div>
</form>
</div>
<script src="https://code.jquery.com/jquery-1.11.2.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="../dist/js/jquery.flagstrap.js"></script>
<script>
$('#basic').flagStrap();
$('#origin').flagStrap({
placeholder: {
value: "",
text: "Language"
}
});
$('#options')
.flagStrap({
countries: {
"US": "English",
"PL": "Polish",
"RU": "Russian",
"DE": "German",
"UA": "Ukrainian",
"ES": "Spanish",
"FR": "French"
},
buttonSize: "btn-sm",
buttonType: "btn-info",
labelMargin: "10px",
scrollable: false,
scrollableHeight: "350px"
});
$('#advanced')
.flagStrap({
buttonSize: "btn-lg",
buttonType: "btn-primary",
labelMargin: "20px",
scrollable: false,
scrollableHeight: "350px",
onSelect: function (value, element) {
alert(value);
console.log(element);
}
});
</script>
</body>
</html>
CSS:
/* Tomorrow Theme */
/* Original theme - https://github.com/chriskempson/tomorrow-theme */
.prettyprint {
background: white;
font-family: Menlo, "Bitstream Vera Sans Mono", "DejaVu Sans Mono", Monaco,
Consolas, monospace;
font-size: 12px;
line-height: 1.5;
border: 1px solid #ccc;
padding: 10px;
}
.pln {
color: #4d4d4c;
}
@media screen {
.str {
color: #718c00;
}
.kwd {
color: #8959a8;
}
.com {
color: #8e908c;
}
.typ {
color: #4271ae;
}
.lit {
color: #f5871f;
}
.pun {
color: #4d4d4c;
}
.opn {
color: #4d4d4c;
}
.clo {
color: #4d4d4c;
}
.tag {
color: #c82829;
}
.atn {
color: #f5871f;
}
.atv {
color: #3e999f;
}
.dec {
color: #f5871f;
}
.var {
color: #c82829;
}
.fun {
color: #4271ae;
}
}
@media print, projection {
.str {
color: #006600;
}
.kwd {
color: #006;
font-weight: bold;
}
.com {
color: #600;
font-style: italic;
}
.typ {
color: #404;
font-weight: bold;
}
.lit {
color: #004444;
}
.pun,
.opn,
.clo {
color: #444400;
}
.tag {
color: #006;
font-weight: bold;
}
.atn {
color: #440044;
}
.atv {
color: #006600;
}
}
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
margin-top: 0;
margin-bottom: 0;
}
/* IE indents via margin-left */
li.L0,
li.L1,
li.L2,
li.L3,
li.L4,
li.L5,
li.L6,
li.L7,
li.L8,
li.L9 {
/* */
}
/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 {
/* */
}
我不知道如何在CSS/Java中添加到子菜单项的链接。有人能给我建议吗?
1条答案
按热度按时间h43kikqp1#
您正在使用
$('#basic')
和$('#origin')
,它们是HTML元素的jQuery选择器,具有这些id。我猜你从一个演示中复制了代码,并将其粘贴到另一个你写的代码中?
如果您将添加参考原始演示,我们将能够更好地解释用法。