1

我通过在 Gigya 外部使用 html、js 和 css 在右侧创建了带有“eye”的密码字段。密码字段中的文本将通过单击眼睛来隐藏/显示。 在此处输入图像描述

我正在尝试在 Gigya 中做同样的事情。但是，问题来了 - 1. 如果我编辑 html 文件，我将无法再次使用 UI Builder。2. Gigya RaaS 中的 Javascript 参数不允许我添加 js，除非添加定义函数的代码。

我的问题是 - 我如何在 Gigya 中做到这一点？

如果我想使用如图所示的复选框，请在此处输入图像描述而不是“眼睛”，Gigya 如何处理这个问题？

4

1 回答 1

0

您可以将任何自定义 css 类添加到 UI Builder 的 CSS Styles 选项卡，它位于 UI Builder 中屏幕左侧列表的底部附近（靠近 JavaScript 参数），然后您可以将该类添加到密码字段使用字段属性窗口的 CSS 类字段（选择字段时 UI Builder 的右侧）。

您可以使用 JavaScript 编辑器在屏幕的onAfterScreenLoad事件中添加您的自定义 JS，它会在屏幕绘制后立即运行。- 或者，您可以在一个函数中本地托管页面上的所有自定义 JS，然后只需在 showScreenSet 调用中添加 onAfterScreenLoad 参数，即

gigya.accounts.showScreenSet({
   "screenSet": "Default-RegistrationLogin",
   "onAfterScreenLoad": myFunctionName
});

任何 HTML 更改都会有点困难，但是您可以使用带有 JQuery 或其他东西的相同事件来完成它。我可以看看它，看看是否有任何其他方式并在几天内更新。

11 月 12 日，更新了一个工作示例：

这是一个有效的示例，我只为登录屏幕做了它，它还需要额外的工作才能完全支持注册屏幕：

gigya.accounts.showScreenSet({
    "screenSet": "Default-RegistrationLogin",
    "onAfterScreenLoad": function() {
        var fieldToChange = document.getElementsByName('password')[0];
        var newPwDiv = document.createElement('div');
        newPwDiv.id = 'passSwitch';
        newPwDiv.innerHTML = "-O-"; // change this out with your image
        newPwDiv.setAttribute('style', 'float: right !important; color: red !important; z-index: 9999999999999999999 !important; display: block !important; position: absolute; margin: -41 0 0 334; cursor: pointer !important; text-align: center;');

        // add eventListener
        newPwDiv.addEventListener("click", function() {
            var currentValue = fieldToChange.type;
            if (currentValue === 'password') {
                fieldToChange.type = "text";
            } else {
                fieldToChange.type = "password"
            }
        });
        // attach to password field
        fieldToChange.parentElement.appendChild(newPwDiv);
    }
});

例子

11 月 14 日，更新了更多信息

要仅通过 UI Builder 执行此操作，您可以将任何相关 CSS 添加到 UI Builder 的 CSS Styles 选项卡：

在此处输入图像描述

然后，您可以将 JavaScript 添加到 JavaScript 参数选项卡：

在此处输入图像描述

演示链接

如果您仍然有问题，我建议您通过 Gigya 控制台打开支持票，我们可以查看您的特定用例。

于 2017-11-10T18:58:31.220 回答