1

抱歉，我刚刚进入 JS 函数，但我们的页面上有一个搜索框，当调用（我认为它使用 ajax）时，它会将搜索数据填充到 div 中。我们曾经使用jquery live search。

在搜索查询中，我们有许多链接，它们有一个类，这个类与一个 jquery modal 相关。旧版本曾经使用模糊功能工作。我正在尝试将功能移植到新搜索中。

我们曾经拥有的...

jquery 搜索：

         <form method="post" action="<? echo constructurl($platform_name,"https") ?>/process/feedbackcreateuser" enctype="multipart/form-data" class="form-right">


    <input name="q" type="text" placeholder="Enter your idea or feedback ... " name="title..." style="width:100%; " value="<? echo $captchamessage ?>">
    <div id="jquery-live-search" style="display:none;"></div>

    <script src="<? echo $asset_url ?>/3rdparty/feedback/jquery.liveSearch.js"></script>
    <script>
    jQuery('input[name="q"]').liveSearch({url: '<? echo constructurl($platform_name,"https")?>/process/searchfeedbackuser/?c=<? echo $id ?>&q='});
    </script>       

</form>

使它工作的JS：

<script type="text/javascript"> <!-- this allows search results to have same js functions -->
$(document).ready(function() { 
$("input[name='q']").blur(function() { 
$("div#jquery-live-search [rel='clickover']").clickover({ html : true} ); 
$("div#jquery-live-search input, div#jquery-live-search textarea").placeholder();
$("div#jquery-live-search .dialog-iframe-card").dialog2IFrame(  { 
            height:900,
              closeOnOverlayClick: true, 
              closeOnEscape: true, 
              removeOnClose: true, 
              showCloseHandle: true,
}); 
$("div#jquery-live-search .dialog-iframe-report").dialog2IFrame(    { 
            height:900,
              closeOnOverlayClick: false, 
              closeOnEscape: true, 
              removeOnClose: true, 
              showCloseHandle: true,
}); 
}); 
}); 
</script>

我们现在拥有的...

JS 搜索（不再是 jQuery）

<script type="text/javascript">
    $(document).ready(function() {
        $('#form form').submit(function(){
            $('#content').load('<? echo constructurl($platform_name,"https")?>/process/searchfeedback/?c=<? echo $id ?>', { 'q': $('input[name="query"]').val()}).slideDown('500')                  
            return false;
        });
    });
    $(function(){
    $('form').each(function () {
        var thisform = $(this);
        thisform.prepend(thisform.find('button.default').clone().css({
            position: 'absolute',
            left: '-999px',
            top: '-999px',
            height: 0,
            width: 0


        }));
    });
});
    </script>

<div id="form">
<form class="form">


<div class="input-group" style="margin-bottom:10px">
<input type="text" name="query" placeholder="Enter your idea or feedback ... "   class="feedback-search  validate[required] form-control search-main" >
  <span class="input-group-btn">
<input type="submit" name="submit" value="Go!" class="btn btn-search">
</span>
</div>

</div></form>
 <form method="post" action="<? echo constructurl($platform_name,"https") ?>/process/feedbackcreate" enctype="multipart/form-data" class="form"  class="form-right">
</form>
<div id="content">
</div>

我一直在尝试类似的事情，但没有运气。

<script type="text/javascript"> <!-- this allows search results to have same js functions -->
$(document).ready(function() { 
$("#form").blur(function() { 
$("div#content [rel='clickover']").clickover({ html : true} ); 
$("div#content input, div#jquery-live-search textarea").placeholder();
$("div#content .dialog-iframe-card").dialog2IFrame( { 
            height:900,
              closeOnOverlayClick: true, 
              closeOnEscape: true, 
              removeOnClose: true, 
              showCloseHandle: true,
}); 
$("div#content .dialog-iframe-report").dialog2IFrame(   { 
            height:900,
              closeOnOverlayClick: false, 
              closeOnEscape: true, 
              removeOnClose: true, 
              showCloseHandle: true,
}); 
}); 
}); 
</script>
4

2 回答 2

0

您的 HTML 有问题：

在开始新标签之前，您似乎根本没有关闭<form class="form">标签。所以你有嵌套的表单，这不可能发生，所以你应该先解决这个问题，因为$('form').each(function () {它很可能不会为你做任何事情。不完全确定为什么要在表单中添加一个宽度 = 0 和高度 = 0 且页面上没有任何位置的克隆按钮。这样做似乎有点尴尬。为什么不使用相同的按钮开始呢？为什么要克隆它？

此外，您还没有在此行的末尾添加分号：

$('#content').load('<? echo constructurl($platform_name,"https")?>/process/searchfeedback/?c=<? echo $id ?>', { 'q': $('input[name="query"]').val()}).slideDown('500')

这将给出语法错误。

您应该在浏览器中打开 javascript 错误报告，以便能够查看所有 jQuery/javascript 错误并一一更正这些错误。在你这样做之后，它甚至可能会自行修复。

另外，请务必加载 jQuery，因为您仍在编码中使用它……这是一个供 jQuery 使用的好 CDN：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

于 2013-08-09T08:00:14.067 回答
0

我无法弄清楚这一点，所以我只是将工作中的 JS 调用弹出到动态内容的页面中，它起作用了！

于 2013-08-10T23:32:38.213 回答