【问题标题】:Input text to a link within an <iframe>将文本输入到 <iframe> 中的链接
【发布时间】:2014-11-12 03:07:17
【问题描述】:

我有一个不在 iframe 中的链接列表,它使用不同的 info.eg 刷新 iframe

href="http://www.myfav.co.uk/nf_req_grid.php?g=top_72&e=joebloggs@mail.com<? echo $email; ?>" target="iframe_c"

这很好用,但我还需要用户为 g=xxxx 位输入不在通用列表中的文本,该通用列表也位于 iframe 之外。我尝试了各种方法,包括隐藏在输入语句中,但只有通过重新加载我希望避免的整个页面才能成功。 我确信答案很简单,但让我望而却步。谢谢

【问题讨论】:

    标签: javascript php html iframe


    【解决方案1】:

    我认为用这样的一些 javascript 来安装它是最简单的:

    <input name="g" type="text" />
    <button name="b" value="Refresh" />
    
    <script>
       $(document).ready( function(){
           $('button[name="b"]').click( function() {
              var g = $('input[name="g"]').val();
              var e = '<?= $email ?>';
              var url = 'http://www.myfav.co.uk/nf_req_grid.php?g='+g+'&e='+email;
              $('#iframeId').attr('src', url);
           });
       });
    </script>
    

    【讨论】:

      【解决方案2】:

      试试这个:

      HTML:

      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
      
      <input type="text" class="ginpt"><br/>
      <a href="http://www.myfav.co.uk/nf_req_grid.php?g={g}&e=joebloggs@mail.com" class="dlink" target="iframe_c">a</a><br/>
      <a href="http://en.wikipedia.org?q={g}&e=a@a.com" class="dlink" target="iframe_c">b</a><br/>
      <a href="http://www.bing.com?q={g}&e=a@a.com" class="dlink" target="iframe_c">c</a><br/>
      
      
      <iframe src="" name="iframe_c"></iframe>
      

      Javascript:

      <script>
      $(document).ready( function(){
        $('.dlink').on('click',function(e){
          e.preventDefault();
          window.open(
            $(this).attr('href').replace('{g}',$('.ginpt').val()),
            $(this).attr('target')
          );
        })
      });
      </script>
      

      在此示例中,我只是将您的 g 查询字符串值替换为一个宏,当他们单击锚点时,该宏将被 javascript 函数替换。

      jsFiddle:http://jsfiddle.net/0dzassds/1/

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2015-02-20
        • 2013-11-14
        • 2019-04-11
        • 1970-01-01
        • 2011-03-04
        • 1970-01-01
        • 1970-01-01
        • 2018-03-22
        相关资源
        最近更新 更多