利用js、html以及Css简单制作了一个模拟手机短信发送

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>MyPhoneSend</title>
    <style type="text/css">
        #phoneOut{
            width: 320px;
            height: 500px;
            border:1px solid #333;
            border-radius: 10px;
            margin-left: 30px;
        }
        #phoneIn{
            width: 300px;
            height: 450px;
            border:1px solid yellow;
            margin: 0 auto;
            margin-top: 20px;
            border-radius: 10px;
        }
        #phoneReception{
            width: 300px;
            height: 400px;
            border-radius: 10px;
            margin: 0 auto;
            /*text-indent: 4px;*/
            text-align: right;
            /*text-decoration-color: green;*/
            color: green;
        }

        #phoneOperation{
            width: 295px;
            height: 40px;
            margin: 0 auto;
            border:1px solid #A9A9A9;
            position: relative;
        }
        #phoneImg{
            display: inline-block;
            width: 30px;
            height: 28px;
            margin: 0 auto;
            border:1px solid yellow;
            margin-top: 5px;
            border-radius: 30px;
        }
        img{
            width: 30px;
            height: 28px;
        }
        #phoneSend{
            width: 50px;
            height: 30px;
            position: absolute;
            margin-top: 5px;
            margin-left: 210px;
        }
        #phoneText{
            position: absolute;
            margin-top: 5px;
            padding: 5px;
        }
        #left{

           display: block;
           background-color: green;
           color: #fff;
           float: left;
           border-radius: 5px;
        }
        #right{
           display: block;
           float: right;
            background-color: green;
           color: #fff;
           border-radius: 5px;
        }
    </style>
    <script type="text/javascript">
        window.onload=function(){
            var oImg=document.getElementById(‘phoneImg‘);
            var oImg1=document.getElementById(‘img1‘);
            var oText=document.getElementById(‘phoneText‘);
            var oSend=document.getElementById(‘phoneSend‘);
            var oReception=document.getElementById(‘phoneReception‘);
            var oleft=document.getElementById(‘left‘);
            var oright=document.getElementById(‘right‘);
            var num=1;
            oImg.onclick=function(){
               num=-num;
               if(num==1){
                   oImg1.src="smell1.jpg";
                   oImg1.value="smell1.jpg";
               }else if(num==-1){
                   oImg1.src="smell3.jpg";
                   oImg1.value="smell3.jpg";
               }
            }
            oSend.onclick=function(){

                 var imgString;
                 var TextString;

                 if(num==1){
                     imgString=‘<img src="smell1.jpg" />‘;
                 }else if(num==-1){
                    imgString=‘<img src="smell3.jpg" />‘;
                 }
                 // 根据一个就是由于加号是一个字符串的形式,所以考虑将你所需要
                 // 进行的操作变成一个字符串。
                 oReception.innerHTML=oReception.innerHTML+ imgString +‘: ‘+oText.value+‘<br />‘;
                 //
                 oText.value=‘‘;
            }
        }
    </script>
</head>
<body>
  <div id="phoneOut">
      <div id="phoneIn">
         <div id="phoneReception"><span id="left"></span><span id="right"></span></div>
          <div id="phoneOperation">
            <!-- <input  id="phoneImg" type="button" name=""> -->
            <span id="phoneImg" ><img id="img1" src="smell1.jpg"></span>
            <input  id="phoneText" type="text" size="30px" />
            <input  id="phoneSend" type="button" name="" value="Send">
          </div>
      </div>

  </div>
</body>
</html>
时间: 2024-10-24 10:00:18

利用js、html以及Css简单制作了一个模拟手机短信发送的相关文章

简单的点击短信发送计时器

  简单的点击短信发送计时器 <input type="button" id="btn" value="发送短信"> <script type="text/javascript" src="/jquery/jquery.js"> var count_time= 60;//定义规定的时间,60秒后再次发送 function start_timer() { if(count_time =

利用网络短信验证码接口实现手机短信轰炸 (历史代码,贴出学习)

//resource.h //{{NO_DEPENDENCIES}} // Microsoft Visual C++ generated include file. // #define IDD_DLG_PROC 101 #define IDR_BIT1 102 #define IDB_BITMAP1 103 #define IDI_ICON1 104 #define IDC_BTN_SEND 1001 #define IDC_LIST_VIEW 1002 #define IDC_EDIT_PH

c#简单易用的短信发送服务 悠逸企业短信服务

 悠逸企业短信发送服务,是一种比较简单易操作的短信发送服务,使用POST的方式,请求相应地址就可以实现短信发送功能 1 /// <summary> 2 /// 短信发送服务 3 /// </summary> 4 public class ShortMsgHelper 5 { 6 /// <summary> 7 /// 短信服务 账号 8 /// </summary> 9 private static string uid = ConfigurationMan

NC传送数据包格式以及用其制作手机短信炸弹

NC -v IP地址 端口<c:\1.txt 具体实例:NC -v 211.157.106.78 8080 <c:\1.txt 打开记事本,写一段批处理让nc自动传包  格式 :go nc -v 211.157.106.78 8080<c:1.txt goto go 将文件保存为批处理1.bat NC传送数据包格式以及用其制作手机短信炸弹,码迷,mamicode.com

简单实现发送手机短信

C#简单实现发送手机短信 偶然想起,像编写一个从电脑向手机发送短信的程序,从网上查找到有三种方式:(1)使用webservice接口发送手机短信,这个可以使用sina提供的webservice进行发送,但是需要进行注册;(2)使用短信mao的方式进行短信的发送,这种方式应该是比较的常用,前提是需要购买硬件设备,这个就不考虑了(3)使用中国网建提供的SMS短信平台,但是,用完几条免费的后,就要收费了. 首先,我用C#实现第一种方法,发现总是错误,这个不解,后来从网上查找原因,有的说,新浪这个功能已

手机短信删除怎么恢复找回呢?简单找回的小方法。

手机短信删除怎么恢复找回呢?简单找回的小方法.我们现在很多的时候可能会因为自己的不小心或者是其他的原因,将一些比较重要的手机短信给误删了,误删之后我们该怎么去恢复呢? 其实我们可以通过一些方法去找回我们删除的手机短信的,像是我们的手机备份或者是其他的备份,我们都是可以找回的,若是我们没有备份的话,我们可以试试下面的方法去找回我们的短信. 1.可以在电脑浏览器上下载"互盾苹果恢复大师",等安装结束,可以将电脑与手机相连用数据线,之后我们可以看到手机上会出现"是否信任此电脑&qu

手机短信删除该如何恢复呢?简单技巧

手机短信现在是真的很少有人去使用了,这或许是个不可争辩的事实,但是你的手机上有没有一些对自己比较重要的短信,像是一些家人的祝福和朋友的关心,或者是你与别人发的一些私密信息.那么你若是误删了这些短信,不用着急,我们可以看看下面的恢复方法,来帮助我们恢复. 最简单的就是我们可以选择找专业人士去帮助我们恢复我们的手机短信,也可以选择去营业厅找回. 其次我们若是误删了我们的短信,不用着急,我们可以从我们的备份中找回我们删除的短信,首先找到我们的工具: 然后找到我们的备份与还原,然后点击我们需要的恢复选项

手机短信删除怎么恢复?教你简单的恢复教程

手机短信是我们生活中比较常简单,但是又不是经常使用到的一个手机功能,但是在一些时候,我们的手机短信对于我们来说也是比较重要的(亲人.朋友),那么若是我们不小心将我们的手机短信给删除了,我们该怎么办呢?不用担心,下面我们可以一起看看找回的方法. 短信回收站恢复 我们首先可以选择使用我们的手机短信回收站恢复我们的手机短信,有的智能手机会有手机回收站这个功能,然后我们需要打开手机短信设置里的"短信回收站",然后便可以根据需要去找回我们的手机短信. 备份与还原 当然了,若是手机上没有短信回收站

手机短信删除了怎么恢复?两个快速恢复的简单技巧

手机短信删除了怎么恢复?你是不是有过这样的困惑,当你遇到自己的手机短信被删除之后,你是怎么样找回的呢?当然了,我们想要找回的手机短信对我们来说都是比较重要的,但是就是这些重要的短信,我们有的时候就很有可能被自己删除了. 那么删除了我们的短信之后,我们该怎么恢复呢?我们是不是可以通过一些方法去找回我们的手机短信呢?其实是完全可以的,下面我们就一起看看具体的恢复方法吧. 其实很多的时候,我们都是会对我们的手机进行备份的,就像我们是华为手机一样,我们可以选择在"设置"界面中点击"用