以文本方式查看主题

-  Foxtable(狐表)  (http://foxtable.net/bbs/index.asp)
--  专家坐堂  (http://foxtable.net/bbs/list.asp?boardid=2)
----  自动隐藏表单  (http://foxtable.net/bbs/dispbbs.asp?boardid=2&id=191046)

--  作者:ycs5801
--  发布时间: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表单
  }
  
  });

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

--  作者:有点蓝
--  发布时间:2024/3/23 12:03:00
--  
给Addselect绑定onchange事件
--  作者:ycs5801
--  发布时间: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编辑过]

--  作者:有点蓝
--  发布时间:2024/3/23 16:39:00
--  
1、去掉:formA.addEventListener("input", function() {
--  作者:ycs5801
--  发布时间: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
--  发布时间:2024/3/23 23:07:00
--  
自己搞定了,暂时无问题。