代码如下:
我设置两个不同的ID,想点击文本框获取各自选择的值,现在我设置的选择,都是取得了一样的值,不是我想要的结果。如何解决呢?在线等待高手
<div class="right">
<input type="text" id="picktime" value="18:00" readonly>--<input type="text" id="picktime1" value="20:00" readonly>
</div>
<script> $(function (){
$('#picktime,#picktime1').mtimer();
});
</script>

解决方案 »

  1.   

    用this关键词
    $("input").click(function(){
    alert($(this).val())
    })
      

  2.   

    你这是俩个文本框, 你是想点击任意一个文本框都获得两个的值吗? 你可以给俩个input都定义点击事件, 点击任何一个的时候,都同时取俩个的值,
    $("#picktime").click(function(){
    var picktime=$(this).val();
    var picktime1=$("#picktime1").val();
    });$("#picktime1").click(function(){
    var picktime1=$(this).val();
    var picktime=$("#picktime").val();
    });
      

  3.   

    我把代码加进去了,还是不行
    <div class="right">
    <input type="text" id="picktime" value="18:00" readonly>-- <input type="text" id="picktime1" value="20:00" readonly>
    </div>
    <script>
    $("#picktime").click(function(){
    var picktime=$(this).mtimer();
    var picktime1=$("#picktime1").mtimer();
    });
    $("#picktime1").click(function(){
    var picktime1=$(this).mtimer();
    var picktime=$("#picktime").mtimer();
    });
    </script>
    加进去以后虽然一个可以获得值,另一个确不行。
    我要实现的效果是
    点击上面的个一个时间input,弹出下面这个选择时间器然后返回值给input,现在只能选一个,返回正确值
      

  4.   

    直接onclick绑定到行内试试。按理说分开绑定是没问题的啊
      

  5.   

    <!DOCTYPE html>
    <html lang="zh"> <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <script type="text/javascript" src="jquery-1.11.2.min.js"></script>
    </head> <body>
    <div class="right">
    <input type="text" id="picktime" value="18:00" readonly>
    <input type="text" id="picktime1" value="20:00" readonly>
    </div>
    <script>
    $("#picktime").click(function() {
    var picktime = $(this).val();
    var picktime1 = $("#picktime1").val();
    alert(picktime);
    });
    $("#picktime1").click(function() {
    var picktime1 = $(this).val();
    var picktime = $("#picktime").val();
    });
    </script>
    </body></html>
      

  6.   

    这根本问题是你用的插件本身在多例应用时有bug。除了修改插件内部代码之外没有别的办法
      

  7.   

    (function ($) {
        $.fn.mtimer = function(opts){
    var defaults = {
    dateStart : new Date(),
    dateNum : 24,
    timeStart :0,
    timeNum : 60,
    onOk : null,
    onCancel : null,
    };
    var option = $.extend(defaults, opts); var input = $(this),
    itemHeight = 48;
    var picker = {
    init : function(){
    var _this = this; _this.renderHTML(); var container = $('.mt_poppanel'),
    mpDate = $('.mt_date', container),
    mpTime = $('.mt_time', container);
    //初始化date
    var dateStr = '',
    dateStart = option.dateStart,
    sYear = dateStart.getFullYear(),
    sMonth = dateStart.getMonth(),
    sDate = 1;
    for(var i=0; i<option.dateNum; i++){
    var nextDate = new Date(sYear, sMonth, sDate+i),
    m = nextDate.getMonth()+1,
    d = nextDate.getDate(),
    da = nextDate.getDay(),
    w = '日一二三四五六'.charAt(da),
    sel = i == 0 ? 'selected' : '';
    if(m < 10){
    m = '0' + m;
    }
    if(d < 10){
    d = '0' + d;
    }
    if(d == 24){
    d = '0' + 0;
    }
    dateStr += '<li class="'+sel+'" data-date="'+d+'">'+d+'时</li>';
    }
    dateStr += '<li></li><li></li>';
    mpDate.find('ul').append(dateStr);

    //初始化time
    var timeStr = '';
    for(var j=0; j<option.timeNum; j++){
    var t = option.timeStart + j,
    sel = j == 0 ? 'selected' : '';
    if(j<10){
    timeStr += '<li class="'+sel+'" data-time=":0'+t+'">0'+t+'分</li>';}
                        if(j>10){
    timeStr += '<li class="'+sel+'" data-time=":'+t+'">'+t+'分</li>';
    }

    }
    timeStr += '<li></li><li></li>';
    mpTime.find('ul').append(timeStr); document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
    //初始化scroll
    var elHeight = itemHeight;
    var dateScroll = new IScroll('.mt_date', {
    snap : 'li',
    probeType : 2,
    tap : true
    });
    dateScroll.on('scroll', function(){
    _this.updateSelected(mpDate, this);
    });
    dateScroll.on('scrollEnd', function(){
    _this.updateSelected(mpDate, this);
    });
    var timeScroll = new IScroll('.mt_time', {
    snap : 'li',
    probeType : 2,
    tap : true
    });
    timeScroll.on('scroll', function(){
    _this.updateSelected(mpTime, this);
    });
    timeScroll.on('scrollEnd', function(){
    _this.updateSelected(mpTime, this);
    }); this.dateScroll = dateScroll;
    this.timeScroll = timeScroll; //初始化点击input事件
    input.on('tap', function(){
    if(container.hasClass('show')){
    _this.hidePanel();
    }
    else{
    _this.showPanel();
    }
    }); //初始化点击li
    mpDate.find('li').on('tap', function(){
    _this.checkDate($(this));
    });
    mpTime.find('li').on('tap', function(){
    _this.checkTime($(this));
    }); //初始化点击事件
    $('.mt_ok', container).on('tap', function(){
    var date = mpDate.find('.selected').data('date');
    var time = mpTime.find('.selected').data('time');
    input.val(date + ' ' + time);
    _this.hidePanel();
    option.onOk && typeof option.onOk=='function' && option.onOk(container);
    });
    $('.mt_cancel', container).on('tap', function(){
    _this.hidePanel();
    option.onCancel && typeof option.onCancel=='function' && option.onCancel(container);
    });
    $('.mt_mask').on('tap', function(){
    _this.hidePanel();
    }); //初始化原有的数据
    this.setValue();
    },
    renderHTML : function(){
    var stime = option.timeStart + ':00';
    var etime = option.timeStart + option.timeNum + ':00';
    var html = '<div class="mt_mask"></div><div id="mtimer" class="mt_poppanel"><div class="topbar"><div class="left-right-box2"><a href="javascript:history.go(-1)"><img src="img/arrow.png"></a></div><div class="center-box1">生效时间段</div><div class="left-right-box"><a href="javascript:void(0);" class="mt_ok a2">确定</a></div><div class="clr"></div></div><div class="shijian-box weizhi1"><div class="left lh pd_5">执行时间</div><div class="right pd_3">18:00 -- 20:00</div><div class="clr"></div></div><a href="again.html"><div class="shijian-box weizhi2"><div class="left lh">重复<br><span class="txt12 white">执行一次</span></div><div class="right"><img src="img/arrow_blue_right.png"></div><div class="clr"></div></div></a><div class="mt_panel"><div class="mt_body"><div class="mt_date"><ul><li class="mt_note"> </li><li></li></ul></div><div class="mt_time"><ul><li class="mt_note"> </li><li></li></ul></div><div class="mt_indicate"></div></div></div></div></div>';
    $(document.body).append(html);
    },
    updateSelected : function(container, iscroll){
    var index = (-iscroll.y) / itemHeight + 2;
    var current = container.find('li').eq(index);
    current.addClass('selected').siblings().removeClass('selected');
    },
    showPanel : function(container){
    $('.mt_poppanel, .mt_mask').addClass('show');
    },
    hidePanel : function(){
    $('.mt_poppanel, .mt_mask').removeClass('show');
    },
    setValue1 : function(){
    var value = input.val();
    var dateArr = value.split(' '),
    date = dateArr[0],
    time = dateArr[1],
    dateItem = $('.mt_date li[data-date="'+date+'"]'),
    timeItem = $('.mt_time li[data-time="'+time+'"]');
    this.checkDate(dateItem);
    this.checkTime(timeItem); },
    checkDate : function(el){
    var target = el.prev('li').prev('li');
    this.dateScroll.scrollToElement(target[0]);
    },
    checkTime : function(el){
    var target = el.prev('li').prev('li');
    this.timeScroll.scrollToElement(target[0]);
    }
    }
    picker.init();
    return picker;
    }
    return $.fn.mtimer;
    })(Zepto);插件代码如上,如何修改可以同时调用多次使用,选中后返回值给不同的ID文本框