Bootstrap Modal引用输入字段值(不起作用)

亚历克斯·曼森

任何对这个问题可以提供帮助的人,我将不胜感激,在此先感谢您。

以下是我的引导程序模式代码。单击提交按钮后,我试图引用模式中的输入字段以检索其值/用户输入。

如您所见,我尝试使用document.getElementById(blogbox).innerHTML

这是无法正常工作的,因此我可能在错误的树上吠叫,因此再次感谢您提供任何有关拉回该数据的指导。

<div class='modal fade' id=addblog tabindex='-1' role='dialog' aria-labelledby='exampleModalLabel' aria-hidden='true'>
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button>
        <h4 class='modal-title' id='exampleModalLabel'>Add Blog</h4>
      </div>
      <div class='modal-body'>
        <form name='testForm'>
          <div class='form-group'>
            <label for='message-text' class='control-label'>Blog Name:</label>
            <input type='text' class='form-control' id='blogbox'>
          </div>
        </form>
      </div>
      <div class='modal-footer'>
        <button type='button' class='btn btn-default' data-dismiss='modal'>Close</button>
        <button type='button' class='btn btn-primary' onclick=addblog('5','" + "document.getElementById(blogbox).innerHTML" + "')>Add</button>
      </div>
    </div>
  </div>
</div>
乔纳·亚伦

好吧,为了让其他任何人都来,我已经尝试简化您的问题...这是您的HTML:

<div class='modal fade' id=addblog tabindex='-1' role='dialog' aria-labelledby='exampleModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><button type='button' class='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>&times;</span></button><h4 class='modal-title' id='exampleModalLabel'>Add Blog</h4></div><div class='modal-body'><form name='testForm'><div class='form-group'><label for='message-text' class='control-label'>Blog Name:</label><input type='text' class='form-control' id='blogbox'></div></form></div><div class='modal-footer'><button type='button' class='btn btn-default' data-dismiss='modal'>Close</button><button type='button' class='btn btn-primary' onclick=addblog('5','document.getElementById(blogbox).innerHTML')>Add</button></div></div></div></div>

具体来说,您在使用HTML按钮的onclick属性时遇到了麻烦。我注意到的第一件事是您这样编写选择器/动作:

'document.getElementById(blogbox).innerHTML'

单引号表示您将代码视为字符串而不是执行代码。我们要改为执行它。

其次,blogbox实际上确实需要放在字符串中,因为它是我们正在搜索的HTML元素ID(有关如何正确使用JS getElementById方法的信息,请参阅我的资料)。

document.getElementById('blogbox').innerHTML

最后,innerHTML不是您要搜索的操作,因为它旨在返回父元素内部的HTML。而是尝试使用值。

因此,总之,如果您将onclick属性更改为:

addblog('5', document.getElementById('blogbox').value)

然后您的代码应按预期开始执行您的功能。

资料来源:http : //www.w3schools.com/jsref/met_document_getelementbyid.asp

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章