dqqvravff05370501 2016-07-01 20:14
浏览 58
已采纳

如何使用javascript从PHP if语句更改iframe的源代码

Based on the result of a PHP if statement, I want to change the source attribute of an iframe.

I have the following:

<?PHP
     if {...}
     else {
          echo "<script>";
          echo "document.getElementById('video-embed').setAttribute('src', 'https://www.youtube.com/embed/dQw4w9WgXcQ');";
          echo "</script>";
     }
?>

<!DOCTYPE html>
     <body>
        <div class="wrapper">
          <iframe id="video-embed" src="...some other youtube video"></iframe>
        </div>
     </body>
</html>

I know that executing valid JavaScript from the if statement is at least feasible, as I've succesfully tested JS alerts. Everything I've seen online has seemed to indicate that the syntax in question for the line "document.getElem..." is valid. Any help would be appreciated.

  • 写回答

1条回答 默认 最新

  • donglian1384 2016-07-01 21:14
    关注

    You have the Javascript before the HTML that creates the element that it's trying to modify, so getElementById() isn't finding the element. Move the PHP code that adds the JS to the end of the HTML, so that the ID will be found. Or put the Javascript in the window's load handler. 

    <?PHP
     if {...}
     else {
          echo "<script>";
          echo "window.addEventListener('load', function() {";
          echo "document.getElementById('video-embed').setAttribute('src', 'https://www.youtube.com/embed/dQw4w9WgXcQ');";
          echo "});";
          echo "</script>";
     }
?>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

  • CodeMirror-v1:JavaScript中基于可编辑iframe的代码编辑器。 见https
    2021-04-12 22:18
    CodeMirror是一个著名的开源JavaScript代码编辑器，其v1版本主要基于可编辑的iframe技术...通过研究`CodeMirror-v1-master`中的源代码，开发者可以深入理解前端代码编辑器的实现机制，对提高自身的编程技能非常有益。
  • Jquery中获取iframe的代码
    2020-10-28 17:54
    在Jquery中获取iframe的代码涉及到JavaScript的DOM操作和Jquery的封装功能。Iframe是一种网页内的框架，可以通过其在网页中嵌入另一个HTML文档。在Jquery开发中，操作iframe通常需要先获取到iframe元素本身，之后...
  • 智软数据查询分析引擎源代码
    2021-03-18 13:14
    该源代码的实现可能包括了数据库连接管理、SQL语句构建、查询优化、数据安全、用户权限控制等多个方面的技术。开发者可能需要熟悉MySQL、PostgreSQL等常见的关系型数据库，以及PHP的面向对象编程和框架如Laravel、...
  • 疯狂HTML 5+CSS 3+JavaScript讲义（第2版）+源代码
    2018-11-19 22:03
    5.2　使用JavaScript脚本控制媒体播放 141 5.3　事件监听 144 5.4　track元素 146 5.5　本章小结 149 第6章　级联样式单与CSS选择器 150 6.1　样式单概述 151 6.2　CSS样式单的基本使用 152 6.3　CSS选择器 158 6.4...
  • 前端需要理解的 JavaScript 知识
    2023-08-24 00:33
    薛定谔的猫96的博客 JavaScript（JS）是单线程的、基于原型的、弱类型的、动态类型的、轻量的、支持面向对象/命令式/声明式编程的、头等函数的、多范式的、解释性（直译式或即时编译）的、也可在非浏览器环境下使用的动态脚本语言。...
  • 2023最全最新前端面试题（附加解答）
    2022-06-23 14:11
    心如天然薄荷清凉的博客 代码一定要正确缩进，建议使用"二个或者四个空格"缩进 语句结束使用分号; 规范定义 JSON 对象，补全双引号 用{}和[]声明对象和数组 变量和函数在使用前进行声明 以大写字母开头命名构造函数，全大写命名常量 代码段...
  • Web前端面试题(附答案及解析)（2025.4月最新版）
    2023-03-27 14:44
    Komorebi ঞ꧔ꦿ的博客 Web前端面试题！面试宝典！总结心得！（附答案及解析）会持续更新哦！ （2025.4月最新版）感谢支持，你们的鼓励是我的动力！
  • 前端面试八股文（超详细）
    2022-03-06 17:42
    小泽今天早睡的博客 JavaScript \1. Promise 的理解 Promise 是一种为了避免回调地狱的异步解决方案 2. Promise 是一种状态机： pending（进行中）、fulfilled（已成功）和rejected（已失败） 只有异步操作的结果，可以决定当前是哪一种...
  • 《javaScrip开发技术大全》源代码
    2010-04-07 21:18
    • sample13.htm 使用HTML注释语句隐藏JavaScript代码 • sample14.htm 提示用户浏览器不支持客户端脚本语言 • sample15.htm 直接执行的JavaScript代码 • sample16.htm 直接调用...
  • LayUi之数据表格的增删改查（内含完整源代码）
    2023-07-14 22:20
    是辉辉啦的博客 关于使用layui进行增删改查的一整套流程清晰明了的编写出来啦！！感兴趣的话就点进来看看呢！！！
  • 没有解决我的问题, 去提问