我可以使用JavaScript向表单添加输入字段吗?

时间:2014-04-22 15:38:43

标签: javascript forms

问题:因为表单是由另一家公司控制的,所以他们只允许我添加跟踪代码,但是我需要添加自己的表单输入字段,所以我想使用JavaScript可能是这样的:

原始表单如下所示:

<form method="post" action="http://subdomain.somewebsite.com">
<input type="hidden" name="client_id" value="160">
<input type="hidden" name="source" value="http://subdomain.somewebsite.com/survey/123">
<fieldset>
<div class="form-group input_text" id="fld-name">
  <label for="name">Name</label>
  <input  class="form-control" type="text" id="name" name="name" value="" placeholder="Name"  required/>
</div>
<div class="form-group input_text" id="fld-email">
  <label for="email">Email</label>
  <input  class="form-control" type="text" id="email" name="email" value="" placeholder="Email"  required/>
</div>
<div class="form-group input_text" id="fld-phone">
  <label for="phone">Phone</label>
  <input  class="form-control" type="text" id="phone" name="phone" value="" placeholder="Phone"  required/>
</div>
<button name="submit-now" id="submit-now" data-lb-name="Button Text" data-lb="editable-rich-text" data-lb-id="btn"> Save <b>$</b> Today! </button>
</fieldset>

这就是我需要添加的内容(通过js):

<input type="text" id="phone" name="phone" maxlength="10" size="10"><br>
<input type="submit" value="Click-to-Call"  onclick="window.open('http://example.com/clickto_status.php?click_id=123&phone_to_call=' + getElementById('phone').value + '&key=123123123123123abc', 'Clickto' , 'width=200,height=200,toolbar=no,location=no, menubar=no, scrollbars=no, copyhistory=no,resizable=no')">

我可能最终会删除弹出代码,但还不确定。

我非常NOOB所以请慢慢打字。提前谢谢

1 个答案:

答案 0 :(得分:0)

是的,你可以这样做:

var url = "http://example.com/clickto_status.php?click_id=123&phone_to_call=";

$('form').append('<input type="text" id="phone" name="phone" maxlength="10" size="10"><br>
<input type="submit" value="Click-to-Call"  onclick="window.open(url + getElementById('phone').value + '&key=123123123123123abc', 'Clickto' , 'width=200,height=200,toolbar=no,location=no, menubar=no, scrollbars=no, copyhistory=no,resizable=no')">');

或者,如果你不想使用jquery做这个 -

选项2:

给你的表单一个像这样的id

然后执行此操作

<form id='myform' ....// your html

document.getElementById('myform').append('<input type="text" id="phone" name="phone" maxlength="10" size="10"><br>
<input type="submit" value="Click-to-Call"  onclick="window.open(url + getElementById('phone').value + '&key=123123123123123abc', 'Clickto' , 'width=200,height=200,toolbar=no,location=no, menubar=no, scrollbars=no, copyhistory=no,resizable=no')">');