为什么我无法打开此 SLDS 选择列表?
Why can't I get this SLDS picklist to open?
我想使用找到的 SLDS 选择列表 here。
我在我的页面中使用了其他几个 SLDS 元素,它们工作正常,我已经包含了必要的 SLDS css。
选择列表在他们提供的示例中实际上不起作用,所以我想知道是否需要额外的配置?文档没有提到任何内容。
谁能告诉我问题出在哪里?
根据我阅读 SLDS 文档后的理解,SLDS 只是 CSS "framework"。要使选择列表工作(打开),您需要包含一些 Javascript,更具体地说,通过向元素(选择列表)添加 class slds-is-open
,选择列表是 "opened"。将 class 应用于下面所述的 div。
<div class="slds-picklist slds-dropdown-trigger slds-dropdown-trigger--click slds-is-open" aria-expanded="true">
由于 SLDS 的安装非常复杂,因此我无法真正制作演示,但希望这对您有所帮助。
嗯,这些下拉菜单需要某种 javascript 或 jquery,因此您必须包含一个文件。 CSS 只是对内容进行样式设置并不能使其正常工作 XD
如果您只使用桌面应用程序(没有 SalesForce1),无需添加代码即可使其工作的简单方法是删除 trigger--click
就让div这样:
<div class="slds-dropdown-trigger slds-is-open"> *//your list//* </div>
当您将鼠标放在 图标上时它会起作用。
它在 SalesForce1 中会有一个奇怪的行为,因为你不能在没有 "clicking" 屏幕的情况下放置手指 "over",牢记这一点.
PS:slds-dropdown-trigger
目前在 SLDS 文档中 已弃用 ,请记住这一点。
如果你对 JS 不满意,你可以使用 this JS 库
或在点击事件上添加 slds-is-open
class
我想使用找到的 SLDS 选择列表 here。
我在我的页面中使用了其他几个 SLDS 元素,它们工作正常,我已经包含了必要的 SLDS css。
选择列表在他们提供的示例中实际上不起作用,所以我想知道是否需要额外的配置?文档没有提到任何内容。
谁能告诉我问题出在哪里?
根据我阅读 SLDS 文档后的理解,SLDS 只是 CSS "framework"。要使选择列表工作(打开),您需要包含一些 Javascript,更具体地说,通过向元素(选择列表)添加 class slds-is-open
,选择列表是 "opened"。将 class 应用于下面所述的 div。
<div class="slds-picklist slds-dropdown-trigger slds-dropdown-trigger--click slds-is-open" aria-expanded="true">
由于 SLDS 的安装非常复杂,因此我无法真正制作演示,但希望这对您有所帮助。
嗯,这些下拉菜单需要某种 javascript 或 jquery,因此您必须包含一个文件。 CSS 只是对内容进行样式设置并不能使其正常工作 XD
如果您只使用桌面应用程序(没有 SalesForce1),无需添加代码即可使其工作的简单方法是删除 trigger--click
就让div这样:
<div class="slds-dropdown-trigger slds-is-open"> *//your list//* </div>
当您将鼠标放在 图标上时它会起作用。
它在 SalesForce1 中会有一个奇怪的行为,因为你不能在没有 "clicking" 屏幕的情况下放置手指 "over",牢记这一点.
PS:slds-dropdown-trigger
目前在 SLDS 文档中 已弃用 ,请记住这一点。
如果你对 JS 不满意,你可以使用 this JS 库
或在点击事件上添加 slds-is-open
class