我有一组数据列表选项，我希望在搜索时进行模糊匹配。例如，如果我输入“PHP HTML”或“PHPAndHTML”，我希望它们中的任何一个与“PHP And HTML”选项相匹配。有没有办法做到这一点？请参见此小提琴或下面的代码以获取示例。
<h1>Datalist Demo</h1>
<label for="default">Pick a programming language</label>
<input type="text" id="default" list="languages">
<datalist id="languages">
<option value="HTML">
<option value="CSS">
<option value="JavaScript">
<option value="Java">
<option value="Ruby And Go">
<option value="PHP And HTML">
<option value="Go">
<option value="Erlang">
<option value="Python And C++">
<option value="C">
<option value="C#">
<option value="C++">
</datalist>我想使用本机数据列表而不是自定义库来执行此操作。原因是在我的实际场景中，我的页面上有数百个输入都使用相同的数据列表，并且使用自定义库会变得非常占用 CPU，而如果我将所有输入绑定到单个数据列表，它实际上非常高效的。
我知道我们可以有条件地定位Outlook '07 -'13,但似乎Outlook.com也符合我的条件.
<!--[if !mso]><!--><br /><!--<![endif]-->
对于与Outlook.com不匹配的地方,是否有更好的代码？
一些背景...
我们正在使用 React 构建的 SPA 站点。我们目前正在集成 Google Analytics 4。我们为 GA4 启用了增强测量，它会自动收集大量数据，包括浏览量。由于 React 路由器使用 Web History API 来更改页面，因此自动 GA4 页面浏览几乎开箱即用。但是，我们注意到在某些数据集上，有时页面标题会滞后并使用上一页的标题。
假设这是由于以下原因而发生的...... 1）当我们开始导航时，React 立即更改 URL，而不知道有关页面的任何其他元数据（包括页面标题），以及 2）一旦我们获取关于页面的元数据，然后我们用该数据更新 DOM；但是... 3) GA4 会在 URL/历史更改时立即触发，这是在我们添加正确标题之前。
知道了这一点，我们明白我们可以通过延迟 URL 更改来解决这个问题，直到我们拥有正确的元数据。但是，由于我们正在使用 React Router，因此似乎没有内置的方法可以做到这一点。似乎我们必须编写自己的路由器，这超出了本项目的范围。有没有人知道有什么方法可以不用大手术来做到这一点？
我们也知道我们可以通过禁用自动网页浏览并简单地实现自定义网页浏览事件来解决这个问题。然而，我们的分析经理对此表示担忧，因为 1) 为了做到这一点，我们必须完全关闭增强测量；没有办法保持启用增强测量并仅禁用自动网页浏览事件，并且 2) 我们将转向非标准实施，这在过去让我们很头疼。
有没有人遇到过这些问题，如果有的话，人们想出了什么样的解决方案来解决这个问题？
是否可以按名称获取变量？
我尝试构建以下函数，但它没有按预期工作......
@function variable-lookup($variable, $suffix: "") {
$value: null;
@if ($suffix != "" and global-variable-exists($variable+"-"+$suffix)) {
$value: #{$variable+"-"+$suffix};
}
@else if (global-variable-exists($variable)) {
$value: #{$variable};
}
@return $value;
}
这是一个如何使用它的示例：
$primary: #000;
$primary-hover: blue;
a {
color: variable-lookup("primary", "base");
&:hover {
color: variable-lookup("primary", "hover");
}
}
当我想围绕这个“变量查找”函数编写一堆特定于上下文的速记包装函数时，真正的力量就会出现。
任何想法如何实现这一目标？
我通过Ajax POST提交一个简单的表单并获取JSON响应,并使用该响应将数据填充到带滑块的定制音频播放器中.
音频播放器滑块功能在Ajax POST之前工作.但是,在我提交表单后,似乎jQuery Mobile正在刷新页面,在刷新之后,滑块被破坏.
我得到的错误消息是:"错误:在初始化之前无法调用滑块上的方法;尝试调用方法'刷新'"
我的表单代码如下:
<form name="test" method="post">
<input type="hidden" name="action" value="test.php">
<input type="number" name="id" />
<button data-icon="star" onclick="onFormSumbit();">Submit</button>
</form>
我的提交功能如下:
function onFormSumbit() {
$.ajax({
type: $('form').attr('method'),
url: $('form input[name=action]').attr('value'),
data: $('form').serialize(),
dataType: 'json',
success: function(response, textStatus, XMLHttpRequest) {
if (response.error) {
console.log('ERROR: ' + response.error);
} else {
mediaSource = response.url;
console.log('URL: ' + response.url);
console.log('ARTIST: ' + response.artist);
console.log('TITLE: ' + response.title);
}
}
});
}
我的滑块编码如下:
<input type="range" id="slider" value="0" min="0" max="100" step="0.01" data-highlight="true" /> …