javascript - 如何将 Javascript ID 值传递到表单占位符中?

标签 javascript html forms query-string

我使用了一个函数来捕获“name”的查询字符串值 - 即想象一个派对邀请网站;

https://cometomyparty.com?name=phil

使用的函数是;

script type="text/javascript">
     function getQuerystring(){
     var q=document.location.toString();
     q=q.split("?");
     q=q[1].split("&");
     var str=""
     for(i=0;i<q.length;i++){
       tmp=q[i].split("=")
       str+=" "+tmp[1]+"<br />"
                                      }
     document.getElementById("name").innerHTML=str
                  }
     onload=function(){
       getQuerystring()
                 }
</script>

然后我可以使用 id="name"调用 'name' 的值,我想在我的页面上使用它,即在标题中,我可以说,Phil,期待让你参加派对...

效果很好。我遇到的问题是,我也有一个正在使用的表单,在其中,它有一个占位符字段,就像这样;

<div class="form-section">
    <input type="text" name="name" class="validate-required" placeholder="Names">

如何将“name”的“id”值插入到此处的占位符中?最终结果是,邀请机制将在同一 URL 上工作,跨多个被邀请者,但 URL 会发生变化。 RSVP 表单会将 URL 中的内容反射(reflect)为占位符,但如果不正确,用户仍然可以更新它。

感谢任何建议。

最佳答案

这个查找占位符并使用 jquery 进行更改

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){ 
        $('#name').attr("placeholder", "your place holder here");
    });
</script>

如果它是 $var 也不需要引号会像

$('#name').attr("placeholder", $str);

或者使用javascript

<script type="text/javascript">
     function getQuerystring(){
         var q=document.location.toString();
         q=q.split("?");
         q=q[1].split("&");
         var str=""
         for(i=0;i<q.length;i++){
             tmp=q[i].split("=");
             str+=" "+tmp[1]+"<br />";
         }
         document.getElementById("name").innerHTML=str;
         document.getElementById("name").placeholder=str;
     }
     onload=function(){
         getQuerystring();
     };
</script>

document.getElementById("name").placeholder="value here" 如果它是一个 var,那么不需要引号

此外,您需要在 html 输入字段中插入一个 id

<div class="form-section">
    <input type="text" id="name" name="name" class="validate-required" placeholder="Names">

关于javascript - 如何将 Javascript ID 值传递到表单占位符中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43858878/

相关文章:

javascript - 如何动态设置ng-model

javascript - Highchart 导出时隐藏/删除注释按钮

javascript - 尝试将 Dropbox 文件上传 API 链接到基本 HTML 表单文件输入

html - 在 bootstrap 3 中创建导航栏时,我似乎无法让按钮居中

forms - 在不填写表格的情况下在 Selenium 中发出 POST 请求?

javascript - 将页面连同内容一起保存为 html

php - PHP 和 Javascript 之间的通信

html - Jade 渲染后如何在两个 <div> 之间添加一个空格字符?

javascript - Bootstrap - float div的固定顶部div不起作用

javascript - BackboneJS View 更新