mobiscrollプラグインの基本的な使い方

 1 
 2 
 3 
 4 
 5   
 6   
 7   
 8   
 9   
10 
11 
12 
13   
14   clear
15   show
16 
17   
18   
19   
<span style="color: #008080">20</span>     $(<span style="color: #0000ff">function</span><span style="color: #000000"> () {
</span><span style="color: #008080">21</span>       <span style="color: #0000ff">var</span> now = <span style="color: #0000ff">new</span><span style="color: #000000"> Date();
</span><span style="color: #008080">22</span>       <span style="color: #0000ff">var</span> currYear =<span style="color: #000000"> now.getFullYear();
</span><span style="color: #008080">23</span>       <span style="color: #0000ff">var</span> currMonth = now.getMonth()   1<span style="color: #000000">;
</span><span style="color: #008080">24</span>       <span style="color: #0000ff">var</span> currDay =<span style="color: #000000"> now.getDate();
</span><span style="color: #008080">25</span>       <span style="color: #0000ff">var</span> option =<span style="color: #000000"> {
</span><span style="color: #008080">26</span>         preset: 'date', <span style="color: #008000">//</span><span style="color: #008000">  ，  ：date\datetime\time\tree_list\image_text\select</span>
<span style="color: #008080">27</span>         theme: 'android-ics light', <span style="color: #008000">//</span><span style="color: #008000">    ，  ：default\android\android-ics light\android-ics\ios\jqm\sense-ui\wp light\wp</span>
<span style="color: #008080">28</span>         display: 'modal', <span style="color: #008000">//</span><span style="color: #008000">     ，  ：modal\inline\bubble\top\bottom</span>
<span style="color: #008080">29</span>         lang: "Chinese"<span style="color: #000000">,
</span><span style="color: #008080">30</span>         showLabel: <span style="color: #0000ff">true</span>,<span style="color: #008000">//</span><span style="color: #008000">false      </span>
<span style="color: #008080">31</span>         rows: 5,<span style="color: #008000">//</span><span style="color: #008000">     ，  3   3 ,</span>
<span style="color: #008080">32</span>         dateFormat: 'yyyy-mm-dd', <span style="color: #008000">//</span><span style="color: #008000">       </span>
<span style="color: #008080">33</span>         setText: '  ', <span style="color: #008000">//</span><span style="color: #008000">      </span>
<span style="color: #008080">34</span>         cancelText: '  ', <span style="color: #008000">//</span><span style="color: #008000">      </span>
<span style="color: #008080">35</span>         dateOrder: 'yyyymmdd', <span style="color: #008000">//</span><span style="color: #008000">         </span>
<span style="color: #008080">36</span>         dayText: ' '<span style="color: #000000">,
</span><span style="color: #008080">37</span>         monthText: ' '<span style="color: #000000">,
</span><span style="color: #008080">38</span>         yearText: ' ', <span style="color: #008000">//</span><span style="color: #008000">        </span>
<span style="color: #008080">39</span>         <span style="color: #008000">//</span><span style="color: #008000"> showNow: false,</span>
<span style="color: #008080">40</span>         nowText: " "<span style="color: #000000">,
</span><span style="color: #008080">41</span>         endYear: currYear   10, <span style="color: #008000">//</span><span style="color: #008000">    </span>
<span style="color: #008080">42</span>         minDate: <span style="color: #0000ff">new</span> Date(currYear, currMonth - 1, currDay   1<span style="color: #000000">),
</span><span style="color: #008080">43</span>         onSelect: <span style="color: #0000ff">function</span> (textVale, inst) { <span style="color: #008000">//</span><span style="color: #008000">       </span>
<span style="color: #008080">44</span>           console.log("     ....."<span style="color: #000000">);
</span><span style="color: #008080">45</span> <span style="color: #000000">        },
</span><span style="color: #008080">46</span>         onClose: <span style="color: #0000ff">function</span> (textVale, inst) { <span style="color: #008000">//</span><span style="color: #008000">          inst:         ：set/cancel</span>
<span style="color: #008080">47</span>           console.log("textVale--"  <span style="color: #000000"> textVale);
</span><span style="color: #008080">48</span>           console.log(<span style="color: #0000ff">this</span>.id);<span style="color: #008000">//</span><span style="color: #008000">this          </span>
<span style="color: #008080">49</span> <span style="color: #000000">        }
</span><span style="color: #008080">50</span> 
<span style="color: #008080">51</span>         <span style="color: #008000">//</span><span style="color: #008000">wheels:[[11,12,13],[21,22,23],[01,02,03]],//         (       ),</span>
<span style="color: #008080">52</span>         <span style="color: #008000">//</span><span style="color: #008000">defaultValue: [12,22]//            ,</span>
<span style="color: #008080">53</span>         <span style="color: #008000">//</span><span style="color: #008000"> formatResult://             </span>
<span style="color: #008080">54</span>         <span style="color: #008000">//</span><span style="color: #008000"> function(){</span>
<span style="color: #008080">55</span>         <span style="color: #008000">//</span><span style="color: #008000">   console.log(1);</span>
<span style="color: #008080">56</span>         <span style="color: #008000">//</span><span style="color: #008000"> }</span>
<span style="color: #008080">57</span> <span style="color: #000000">      }
</span><span style="color: #008080">58</span>       
<span style="color: #008080">59</span>       <span style="color: #008000">//</span><span style="color: #008000">      </span>
<span style="color: #008080">60</span>       $("#input"<span style="color: #000000">).mobiscroll().date(option);
</span><span style="color: #008080">61</span> 
<span style="color: #008080">62</span>       <span style="color: #008000">//</span><span style="color: #008000">      </span>
<span style="color: #008080">63</span>       // $("#input"<span style="color: #000000">).mobiscroll().time(option);
</span><span style="color: #008080">64</span> 
<span style="color: #008080">65</span>       $("#clear").click(<span style="color: #0000ff">function</span><span style="color: #000000"> () {
</span><span style="color: #008080">66</span>         $("#input").mobiscroll("clear"<span style="color: #000000">);
</span><span style="color: #008080">67</span>         <span style="color: #0000ff">return</span> <span style="color: #0000ff">false</span><span style="color: #000000">;
</span><span style="color: #008080">68</span> <span style="color: #000000">      });
</span><span style="color: #008080">69</span> 
<span style="color: #008080">70</span>       $("#show").click(<span style="color: #0000ff">function</span><span style="color: #000000"> () {
</span><span style="color: #008080">71</span>         $("#input").mobiscroll("show"<span style="color: #000000">);
</span><span style="color: #008080">72</span>         <span style="color: #0000ff">return</span> <span style="color: #0000ff">false</span><span style="color: #000000">;
</span><span style="color: #008080">73</span> <span style="color: #000000">      });
</span><span style="color: #008080">74</span> <span style="color: #000000">    });
</span><span style="color: #008080">75</span>   
76 
77 
78