js实现输入框文本的复制，并且文本框为不可编辑

这两天在做Web前端时，遇到需求通过js实现文本复制的功能。

1.实现效果图



2.html页面代码

  <div class="consigneeadd orderlist-box col-xs-12 pull-left">

        <div class="row row-space bg-white">

            <div class="col-xs-12">

                <strong><span>US Wearehouse</span></strong>

            </div>

            <c:if test="${warehouseList!=null}">

            <c:forEach items="${warehouseList}" var="o" varStatus="status">

            <div class="col-xs-12 bg-white ">

                <input type="text" class="form-control" readonly="true" onclick="copy('Address1${status.index}')" id="Address1${status.index}" value="${o.Address1}" placeholder="11034 S. La Cienega Blvd," aria-describedby="basic-addon2">

            </div>

            <div class="col-xs-12 bg-white ">

                <input type="text" class="form-control" readonly="true" onclick="copy('identifierId${status.index}')"  id="identifierId${status.index}" value="${customer.identifierId}" placeholder="Suite: 88-352387282," aria-describedby="basic-addon2">

            </div>

            <div class="col-xs-12 bg-white ">

                <input type="text" class="form-control" readonly="true" onclick="copy('Address2${status.index}')" id="Address2${status.index}" value="${o.Address2}" placeholder="Inglewood, CA 90304," aria-describedby="basic-addon2">

            </div>

            <div class="col-xs-12 bg-white ">

                <input type="text" class="form-control" readonly="true" onclick="copy('Tel${status.index}')" id="Tel${status.index}" value="${o.Tel}" placeholder="+1 310 665 9230," aria-describedby="basic-addon2">

            </div>

        </div>

        </c:forEach>

        </c:if>

    </div>

3.js代码

function copy(id){

  var ID=document.getElementById(id);

  ID.select(); // 选择对象

  document.execCommand("Copy");// 执行浏览器复制命令

  }