1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="utf-8" />
- <title>CocoBlockly CocoPi – CocoRobo CocoPi Module</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <meta http-equiv="Content-Type" content="text/html; scharset=UTF-8">
- <meta name="theme-color" content="#2C4FCD">
- <style>
- *{
- box-sizing: border-box;
- }
- body{
- width: 100%;
- height: 100vh;
- margin: 0;
- }
- #iframeDiv{
- display: flex;
- flex-flow: wrap;
- /* justify-content: space-evenly; */
- }
- #iframeDiv img{
- width: 25%;
- /* height: 360px; */
- padding: 5px;
- }
- input{
- padding: 7px;
- font-size: 1rem;
- outline: none;
- }
- button{
- margin-left: 10px;
- color: #fff;
- border: none;
- border-radius: 2px;
- display: inline-block;
- height: 36px;
- line-height: 36px;
- padding: 0 16px;
- text-transform: uppercase;
- vertical-align: middle;
- -webkit-tap-highlight-color: transparent;
- background-color: #2196F3;
- cursor: pointer;
- }
- </style>
- </head>
- <body>
- <div id="iframeDiv">
- <!-- <iframe src="http://192.168.43.193:18811" scrolling="no"></iframe> -->
- </div>
- <div style="margin: 20px auto;text-align: center;">
- <input type="text" id="httpSrc" placeholder="">
- <button onclick="addIframe()">添加</button>
- </div>
- </body>
- <script>
- function addIframe(){
- var iframeDiv = document.getElementById("iframeDiv");
- var httpSrc = document.getElementById("httpSrc").value;
- let createIframe = document.createElement("img")
- createIframe.scrolling = "no"
- console.log(httpSrc)
- if(httpSrc){
- createIframe.src = `http://${httpSrc}:18811`
- console.log(createIframe)
- // createIframe.onload=function(){
-
- // }
- iframeDiv.appendChild(createIframe)
- document.getElementById("httpSrc").value = ""
- }
-
- }
- </script>
- </html>
|