Javascript 如何在Gigya中显示/隐藏密码字段

我在Gigya之外使用html、js和css创建了右侧带有“eye”的密码字段。密码字段中的文本将通过单击眼睛隐藏/显示。

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

我的问题是-在吉佳我该怎么做

---

如果我想使用如图所示的复选框而不是“eye”，Gigya是如何处理的？

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

您可以使用JavaScript编辑器在屏幕事件中添加自定义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样式选项卡：

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

---

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

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

您可以使用JavaScript编辑器在屏幕事件中添加自定义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样式选项卡：

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

---

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

谢谢您提供的信息。李维！下面是我试图添加到Gigya的一个（CSS/HTML/JS），我认为我仍然缺少一些东西-.field-eye图标{float:right；margin-left:-25px；margin-top:-25px；position:relative；z-index:2；}.eye容器{padding-top:50px；margin:auto；}谢谢你的信息。李维！下面是我试图添加到Gigya的一个（CSS/HTML/JS），我认为我仍然缺少一些东西-.field-eye图标{float:right；margin-left:-25px；margin-top:-25px；position:relative；z-index:2；}.eye容器{padding-top:50px；margin:auto；}