打开和关闭jQuery功能

Question

我是jQuery的新手，并且在处理某些问题时遇到了一些麻烦。

我有这个功能，被称为在页面底部附加自动完成功能的文本框，这部分工作正常。这里是被称为启用自动完成代码：

$(function(){ 
    $('#intext').autocomplete('get-data.php?mode=sql', { 
     width: 400, 
     max: 5, 
     selectFirst: false 
    }); 
}); 

但是在搜索框中包含了两种不同类型的搜索两个单选按钮。自动完成功能只能用于一种搜索类型。

所以我的问题是，我怎么能通过点击一个单选按钮来启用它，并通过单击第二个单选按钮来禁用它？

编辑

自动完成脚本有一个.autocomplete（“禁止”）的方法，但我不知道如何启用/禁用基于哪个单选按钮被选中的。

EDIT 2

我想获得由“罗里McCrossan”建议的工作方法，因为我使用jQuery UI自动完成。下面是我的单选按钮和搜索框代码：

News: <input type="radio" class="myRadio" name="search_type" value="news" checked="checked" onclick="this.form.action='/search.php';" /> 
Media Gallery: <input type="radio" class="myRadio" name="search_type" value="media" onclick="this.form.action='/media.php';" /> 
<input id="intext" class="txt" type="text" name="searchterms" /> 

我在每一页上运行脚本下面的代码都：

addAutoComplete($("#intext")); 

$(".myRadio").change(function() { 
    if ($(this).val() == "news") { 
     if (!$("#intext").hasClass("ui-autocomplete-input")) 
      addAutoComplete($("#intext")); 
    } 
    else { 
     $("#intext").autocomplete('destroy') 
    } 
}); 


function addAutoComplete($el) { 
    $('#intext').autocomplete('autocomplete-data.php?mode=sql', { 
     width: 400, 
     max: 5, 
     selectFirst: false 
    }); 

} 

这似乎并没有工作，和错误控制台在Firefox中不显示任何错误。

Answer 1

假设这是jQueryUI自动完成，您可以使用$el.autocomplete("destroy")删除自动完成功能。

addAutoComplete($("#intext")); // on load 

$(".myRadio").change(function() { 
    if ($(this).val() == "a") { 
     if (!$("#intext").hasClass("ui-autocomplete-input")) 
      addAutoComplete($("#intext")); 
    } 
    else { 
     $("#intext").autocomplete('destroy') 
    } 
}); 

function addAutoComplete($el) { 
    $el.autocomplete('get-data.php?mode=sql', { 
     width: 400, 
     max: 5, 
     selectFirst: false 
    }); 
} 

Answer 2

最好的解决方案是在选择两个单选按钮之一时禁用自动完成功能。通过将methodname作为jQuery插件调用的第一个参数来调用jQuery UI方法。因此，例如：”

// First create the autocomplete 
$('#textbox1').autocomplete(); 

// call a method on the 'autocompleted' textbox 
$('#textbox1').autocomplete('methodname', 'methodparam1', methodparam2, etc) 

因此，在这种情况下：

$('.classOfTheTwoRadioButtons').change(function(e) { 
    var method = $(e.target).is(':checked [value=valueIfAutocomplete]')? 'enable': 'disable'; 
    $('#textbox').autocomplete(method); 
}); 

其他选项：具有相同名称创建两个文本框和只重视对他们的一个自动完成使用jQuery的toggle()功能。隐藏你不想看的时候所选择的单选按钮被选中的人。

$('.classOfTheTwoRadioButtons').change(function(e) { 
    var $e = $(e.target); 
    $('#firstTextBox').toggle($e.val() === 'value1'); 
    $('#secondTextBox').toggle($e.val() === 'value2'); 
}); 

Answer 3

你应该检查，如果你autocomplete()插件有一destroy某种消除他行为的行为。如果是这样，只需选择“自动完成关闭”收音机即可。

如果您的插件没有该选项，只需创建文本字段即可。第一个附带自动完成，第二个没有它。然后根据您的复选框切换它们。

Answer 4

鉴于与值单选按钮“A”使得能够自动完成和一个具有值“B”禁用它

$(".myRadio[value='a']").click(function() { 
    $('#intext').autocomplete('enable'); 
} 
$(".myRadio[value='b']").click(function() { 
    $('#intext').autocomplete('disable'); 
}