Foxtable(狐表)用户栏目专家坐堂 → 自动隐藏表单


  共有1658人关注过本帖树形打印复制链接

主题:自动隐藏表单

帅哥哟,离线,有人找我吗?
ycs5801
  1楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:五尾狐 帖子:1065 积分:7598 威望:0 精华:0 注册:2009/6/24 9:44:00
自动隐藏表单  发帖心情 Post By:2024/3/23 11:44:00 [只看该作者]

With wb.AddInputGroup("form2", "ipg1", "")  
    With wb.AddInputGroup("form2", "ipg256", "信息录入")    
        .AddInput("信息主题", "信息主题", "Text")
        .Addselect("转让方式", "转让方式", "[赠送]|出售")
        .AddInput("期望价格", "期望价格", "number")      
    End With
end with
wb.AppendHTML("<script src='./lib/test.js'></script>") '引入脚本文件

js代码:
// 获取A表单和B表单的引用
var formA = document.getElementById("转让方式");
var formB = document.getElementById("期望价格");

// 为A表单添加监听事件
formA.addEventListener("input", function() {
  // 获取A表单的输入值
  var value = formA.value.trim();

  // 判断A表单的输入值,并控制B表单的显示状态
  if (value === "出售") {
    formB.style.display = "block"; // 显示B表单
  } else if (value === "赠送") {
    formB.style.display = "none"; // 隐藏B表单
  }
  
  });

想实现:转让方式如果选择出售则显示期望价格栏,如果是赠送则隐藏期望价格栏。现在选择后无反应。

 回到顶部
帅哥,在线噢!
有点蓝
  2楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:110743 积分:563641 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2024/3/23 12:03:00 [只看该作者]

给Addselect绑定onchange事件

 回到顶部
帅哥哟,离线,有人找我吗?
ycs5801
  3楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:五尾狐 帖子:1065 积分:7598 威望:0 精华:0 注册:2009/6/24 9:44:00
  发帖心情 Post By:2024/3/23 16:08:00 [只看该作者]

 已经绑定: .Addselect("转让方式", "转让方式", "[赠送]|出售").Attribute = "onc hange='dtauto()'"

function dtauto(){
// 获取A表单和B表单的引用
var formA = document.getElementById("转让方式");
var formB = document.getElementById("期望价格");
console.log("auto");
// 为A表单添加监听事件
formA.addEventListener("input", function() {
  // 获取A表单的输入值
  var value = formA.value.trim();

  // 判断A表单的输入值,并控制B表单的显示状态
  if (value === "出售") {
    formB.style.display = "block"; // 显示B表单
  } else if (value === "赠送") {
    formB.style.display = "none"; // 隐藏B表单
  }

  });
}

测试显示控制台已输出“auto”,js中的value值也是正常,但是无法隐藏b表单
[此贴子已经被作者于2024/3/23 16:09:03编辑过]

 回到顶部
帅哥,在线噢!
有点蓝
  4楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:110743 积分:563641 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2024/3/23 16:39:00 [只看该作者]

1、去掉:formA.addEventListener("input", function() {

 回到顶部
帅哥哟,离线,有人找我吗?
ycs5801
  5楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:五尾狐 帖子:1065 积分:7598 威望:0 精华:0 注册:2009/6/24 9:44:00
补充一下  发帖心情 Post By:2024/3/23 18:57:00 [只看该作者]

function dtauto(){
    var formA = document.getElementById("期望价格");

var selectElement = document.getElementById('转让方式');
 console.log(selectElement);
// 方法1: 使用selectedIndex
var selectedIndex = selectElement.selectedIndex;
var selectedValue = selectElement.options[selectedIndex].value;
console.log("选中的值是: " + selectedValue);
if (selectedValue === "出售") {
    formA.style.display = "block"; // 显示B表单
  } else if (selectedValue === "赠送") {
    formA.style.display = 'none'; // 隐藏B表单

  }
}

现在js中改成这样,效果是选中出售之后可以输入期望价格,选中赠送后,输入价格的地方已经隐藏,但是“期望价格”这4个字还在,这4个字能隐藏吗?
[此贴子已经被作者于2024/3/23 22:48:04编辑过]

 回到顶部
帅哥哟,离线,有人找我吗?
ycs5801
  6楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:五尾狐 帖子:1065 积分:7598 威望:0 精华:0 注册:2009/6/24 9:44:00
  发帖心情 Post By:2024/3/23 23:07:00 [只看该作者]

自己搞定了,暂时无问题。

 回到顶部