Wordpress上的jQuery TimeEntry

时间:2017-08-11 03:41:49

标签: php jquery html wordpress

我正在尝试将一个时间范围字段实现到我的Wordpress页面中。我需要在哪里放置此代码,如果我希望在页面上显示范围文本框,如何调用它?

$('.timeRange').timeEntry({beforeShow: customRange}); 


function customRange(input) { 
    return {minTime: (input.id === 'timeTo' ? 
        $('#timeFrom').timeEntry('getTime') : null),  
        maxTime: (input.id === 'timeFrom' ? 
        $('#timeTo').timeEntry('getTime') : null)}; 
}

我有一个简单的时间输入字段。

<script>
    $.timeEntry.setDefaults({spinnerImage: 'http://sdtest.net/wp-content/uploads/2017/06/spinnerDefault.png'});
    </script>
    <script>
    $(function () {
        $('#timeEntry').timeEntry({defaultTime: +20});
    });
</script>

我用这个html调用它

<input type="text" id="timeEntry">

只需要帮助将远程文本框脚本放在正确的位置并使用正确的代码来调用它。

非常感谢任何帮助。

谢谢, 马特

1 个答案:

答案 0 :(得分:0)

我认为它应该是这样的:

<script>

$.timeEntry.setDefaults({spinnerImage: 'http://sdtest.net/wp-content/uploads/2017/06/spinnerDefault.png'});

function customRange(input) { 
  return {
    minTime: (input.id === 'timeTo' ? $('#timeFrom').timeEntry('getTime') : null),  
      maxTime: (input.id === 'timeFrom' ? $('#timeTo').timeEntry('getTime') : null)
  }; 
}

$(function () {   // This is a "document ready" wrapper

  $('#timeEntry').timeEntry({defaultTime: +20});      
  $('.timeRange').timeEntry({beforeShow: customRange});

});
</script>

您发布的内容不需要多个<script></script>标记。这些是包含代码的标签。

$(function () {是&#34;文件已准备好&#34;包装。
这是写$(document).ready(function(){

的简写方式

内部的内容只会在DOM (文档对象模型)完全加载时执行(所以当加载所有元素时),而不是在解析时执行。