CSS / jQuery / JavaScript中的链接

vi4fp9gy 于 2022-12-24 发布在 jQuery

关注(0)|答案(1)|浏览(137)

我使用的语言切换内置在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中添加到子菜单项的链接。有人能给我建议吗？

css

来源：https://stackoverflow.com/questions/74893138/links-in-css-jquery-javascript