点击电话号码拨打

html

<!-- 左侧定位开始 --> 
<div class="pcLeftD65">
    <div class="pcLefttel65">
        <img  src="http://bd.jgyljt.com/jgswt/img/pcFooter/pcLeftFree65.gif">
    </div>
    <div class="pcLeftkey65">
        <form action="" method="post" id="jgForm_1" onsubmit="return false;" class='pcLeftFo65' target='i'> <input type="tel" class="pcTel_in65"  class="guahao_int"  name="tell" placeholder="您的电话号码" autofocus="autofocus" >
            <table id="myTable" class="pcPho65">
                <tbody>
                    <tr>
                        <td class="pcLeftNum">1</td>
                        <td class="pcLeftNum">2</td>
                        <td class="pcLeftNum">3</td>
                    </tr>
                    <tr>
                        <td class="pcLeftNum">4</td>
                        <td class="pcLeftNum">5</td>
                        <td class="pcLeftNum">6</td>
                    </tr>
                    <tr>
                        <td class="pcLeftNum">7</td>
                        <td class="pcLeftNum">8</td>
                        <td class="pcLeftNum">9</td>
                    </tr>
                    <tr>
                        <td class="pcLeftNum">*</td>
                        <td class="pcLeftNum">0</td>
                        <td class="leftDel65"><img src="http://bd.jgyljt.com/jgswt/img/pcFooter/pcLeftclear65.png" style="display:inline-block;"></td>
                    </tr>
                </tbody>
            </table>
            <input type="submit" class="pcLeftSu65" name="说明" id="" value="" jgformname="jgForm_1" >
        </form>
    </div>
</div>
<script type="text/javascript">
    $(function(){
        $(".pcLefttel65").mouseover(function() {
            $(".pcLeftkey65").stop().animate({ "left": "0px" }, 1000)
            $(".pcLefttel65").hide(200);
        })
        $(".pcLeftkey65").mouseleave(function() {
                $(".pcLeftkey65").stop().animate({ "left": "-170px" }, 500)
                $(".pcLefttel65").show(800)
        })
    });
    $(".pcLeftNum").click(function(){
        let a=$(".pcTel_in65").val();
        let leftNum=$(this).html();
        $(".pcTel_in65").val(a+leftNum);
    })
    $(".leftDel65").click(function(){
        let a=$(".pcTel_in65").val();
        console.log(a.substr(0, a.length - 1));
        $(".pcTel_in65").val(a.substr(0, a.length - 1));
    })
</script>
<!-- 左侧定位结束 -->

css

    /*左侧定位开始*/
    .pcLeftD65{
        z-index:999;
    }
    .pcLefttel65{
        position: fixed;
        left:0px;
        top:200px;
        list-style:none;
        margin:0;
        padding:0;
        z-index:99;
    }
    .pcLeftkey65
    {
        background-image:url("http://bd.jgyljt.com/jgswt/img/pcFooter/pcLeftdianhua65.png");
        height: 340px;
        width: 170px;
        position: fixed;
        top:200px;
        list-style:none;
        margin:0;
        padding:0;
        left:-170px;
        z-index:9999;
    }
    .pcPho65{
        width:120px;
        height: 120px;
        table-layout: fixed;
        border-collapse: collapse;
        cursor:pointer;
    }
    .pcPho65 td,.first-table th{
        border:1px solid #ccc;
        text-align: center;
        font-weight:bold;
        color:#666;
        height: 30px;
    }
    .pcLeftFo65{
        margin-top: 100px;
        margin-left: 25px;
    }
    .pcTel_in65{
        outline:none;
        padding-left:5px;
        box-sizing:border-box;
        width: 120px;
        height:26px;
        font-size:14px;
    }
    .pcLeftSu65{
        outline:none;
        border:0;
        margin-top: 10px;
        height: 24px;
        width: 119px;
        background:url("http://bd.jgyljt.com/jgswt/img/pcFooter/pcLeftHui65.png") no-repeat;
        background-size:100% 100%;
    }
/*左侧定位结束*/

转载于:https://www.cnblogs.com/1666818961-lxj/p/9366843.html