Javascript 语法错误：预期的表达式，得到 '.' 查询

SyntaxError: expected expression, got '.' Jquery

提问by Prady

I am trying to change the text of a textbox when a checkbox is checked and i get this error on the console

我试图在选中复选框时更改文本框的文本，但在控制台上出现此错误

SyntaxError: expected expression, got '.'

语法错误：预期的表达式，得到 '.'

Its probably something very simple, but i cant figure this out

它可能很简单，但我无法弄清楚

HTML

HTML

<input type="checkbox" name="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain" id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain">

<input id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLeadForAccount" type="text" value="Company" size="20" name="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLeadForAccount" maxlength="80">

Javascript

Javascript

    $(document).ready(function () {

   $('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain').change(function() {
       if ('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain').is(':checked')) {
         $('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLead').val('Website_Domain__c');
       }
       else{
         $('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLead').val('Company');
       }
    });

});

JSFiddle

JSFiddle

回答by T.J. Crowder

Aside from the missing $(on your ifcondition, you're using characters (colons) in your idthat aren't valid for a simple id selector in CSS (e.g., the #xxxtype); details. jQuery maylet you get away with it (although I'd be fairly surprised), but it's invalid, and so could change in any dot release.

除了$(您的if条件缺失之外，您还在使用id对 CSS 中的简单 id 选择器无效的字符（冒号）（例如，#xxx类型）；详情。jQuery可能会让你侥幸逃脱（虽然我会相当惊讶），但它是无效的，因此可能会在任何 dot 版本中更改。

You can use an attribute selector instead:

您可以改用属性选择器：

$("[id=pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain]")...

...or escape all those colons.

...或逃避所有这些冒号。

Also, you can use this.checkedin the changehandler, and the conditional operator rather than if/else:

此外，您可以this.checked在change处理程序中使用条件运算符而不是if/else：

$(document).ready(function () {
    $('[id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain"]').change(function() {
        $('[id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLead"]').val(
            this.checked ? 'Website_Domain__c' : 'Company'
        );
    });
});

Live copy:

实时复制：

$(document).ready(function () {
    $('[id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain"]').change(function() {
        $('[id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLead"]').val(
            this.checked ? 'Website_Domain__c' : 'Company'
        );
    });
});

<label>
  <input type="checkbox" id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain"> The checkbox
</label>
<br>
The input: <input type="text" id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:icConvMatchFieldInLead">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

回答by Milind Anantwar

You have two issues in your code:

您的代码中有两个问题：

1) You need to escape the special characters while building the selector

1）您需要在构建选择器时转义特殊字符

2) You are missing jquery selector in if condition.

2）您在 if 条件中缺少 jquery 选择器。

also you can narrow down the code to use $(this)to use context of currently clicked object

您也可以缩小$(this)用于使用当前单击对象的上下文的代码

 $('[id="pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain"]').change(function() {
   if( $(this).is(':checked')) {
     $(this).next().val('Website_Domain__c');
   }
   else{
    $(this).next().val('Company');
   }
});

Working Demo

工作演示

回答by Deepak

if ('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain').is(':checked'))

Is your problem, it should be

是你的问题，应该是

if ($('#pgManageCS:frmManageCS:pbSettings:pbsDupeMatch:pbsiDupeMatch:chkwebsiteDomain').is(':checked'))

I recommend you use a linter like JSHint

我建议你使用像JSHint这样的linter