通过HTML元素将变量传递给javascript

通过HTML元素将变量传递给javascript,javascript,jquery,html,modal-dialog,Javascript,Jquery,Html,Modal Dialog,我在HTML中创建了3个隐藏按钮来保存我的值 第四个提交按钮将获取这3个按钮的值,并将它们用作Javascript函数的参数 我的隐藏按钮 <button type="button" value="Title Retrieved should be here" id="TitleHolder" style="visibility: hidden;"></button> <button type="button" value="Each year, thousands

我在HTML中创建了3个隐藏按钮来保存我的值

第四个提交按钮将获取这3个按钮的值,并将它们用作Javascript函数的参数

我的隐藏按钮

<button type="button" value="Title Retrieved should be here" id="TitleHolder" style="visibility: hidden;"></button>
<button type="button" value="Each year, thousands of patients and families from across the United States and beyond travel to Boston Children's Hospital to seek treatment for complex diseases and conditions. All of our patients are unique, but their stories tend to have a lot in common: a serious health problem, doctors and nurses collaborating from half a world away, the remarkable determination of children and families -- and a happy ending." id="StoryHolder" style="visibility: hidden;"></button>
<button type="button" value="25" id="IDHolder" style="visibility: hidden;"></button>
<a id="btn" class="initialism basic_open" onclick="viewModal(document.getElementById('TitleHolder').value, document.getElementById('StoryHolder').value, document.getElementById('IDHolder').value)" >Read full story &raquo</a> </div>    

代码的主要问题是
viewmodel
中的
ID
变量。 正如您在此处看到的,调用
viewmodel
时,您从未传递过您的模式ID

viewModal(document.getElementById('TitleHolder').value, document.getElementById('StoryHolder').value, document.getElementById('IDHolder').value)
我更改了你的代码,使它更“干净”。这是你想要的工作版本。避免将事件直接添加到HTML元素中

//等待页面完成加载。
addEventListener(“加载”,函数(){
//检索并存储隐藏的输入元素。
var storyHolder=document.getElementById('storyHolder');
var idHolder=document.getElementById('idHolder');
var titleHolder=document.getElementById('titleHolder');
//添加点击事件按钮。
document.getElementById('btn')。addEventListener('click',function(){
//单击按钮时,记录所有隐藏的输入值。
log(storyHolder.value、idHolder.value、titleHolder.value);
//TODO:这里是模态代码。
//取消注释:document.getElementById('REPLACE_THIS_WITH_MODAL_ID')。style.display=“block”;
});
});


阅读全文»
这不是干净的HTML,看起来像某种模板语言。你能解释一下吗?你想要隐藏的输入。虽然一个按钮可以保存一个值,但使用隐藏的输入会带来更多的好处。很抱歉,我将编辑我的问题并放入客户端HTMLI刚刚编辑了它,现在清楚了吗?一旦在javascript函数中发出警报,检查值是否出现。HTML中的一切似乎都很好。
viewModal(document.getElementById('TitleHolder').value, document.getElementById('StoryHolder').value, document.getElementById('IDHolder').value)