时间戳

首页 > 解决方案 > 如何在 jquery 中获取 UL / LI 值

javascript - 如何在 jquery 中获取 UL / LI 值

问题描述

我需要一系列城市，它在 jquery 中是如何工作的？我从不接触前端，所以我是新手。

<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content" id="ui-id-180" tabindex="0" style="display: block; top: 166px; left: 1037.86px; width: 203px;">
<li class="ui-menu-item" id="ui-id-418" tabindex="-1">City1</li>
<li class="ui-menu-item" id="ui-id-419" tabindex="-1">City2</li>
<li class="ui-menu-item" id="ui-id-420" tabindex="-1">City3</li>
<li class="ui-menu-item" id="ui-id-421" tabindex="-1">City4</li></ul>

此城市列表也与输入字段相关联。在服务器端生成的值。主要 UL 的 id 为“ui-id-180”，它可能会在用户端发生变化吗？输入字段是否与下拉列表连接？如果是这样，是否有可能知道哪个“ul li”与哪个领域相关？我在输入字段中获取值的代码：

$("[name=" + City.GetInputName() + "]").keyup(function(eventObject){
$("[name=" + Source.GetInputName() + "]").val(function(index, value){});});

更新 1 有一个使用 @mplungjan 答案的示例。如果有多个 UL，则该数组具有不需要的值。这就是为什么我询问输入字段和 UL 的连接（过滤值）。

标签： javascriptjquery

解决方案

这是在不触摸 ID 的情况下获取 jQuery 地图中的城市的方法

const cities = $(".ui-autocomplete li")
  .map(function() { return this.textContent.trim()})
  .get();

console.log(cities)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content" id="ui-id-180" tabindex="0" style="display: block; top: 166px; left: 1037.86px; width: 203px;">
  <li class="ui-menu-item" id="ui-id-418" tabindex="-1">City1</li>
  <li class="ui-menu-item" id="ui-id-419" tabindex="-1">City2</li>
  <li class="ui-menu-item" id="ui-id-420" tabindex="-1">City3</li>
  <li class="ui-menu-item" id="ui-id-421" tabindex="-1">City4</li>
</ul>

推荐阅读