無法與JQuery一起使用RadioButton - 警報不會彈出

我有兩個單選按鈕，並且我希望在檢查其中一個時顯示警報，但似乎問題在於它無法識別該元素警報不會彈出！無法與JQuery一起使用RadioButton - 警報不會彈出

用於工作時，此代碼，但它不會了（我想我改變的要素之一的標識，這就是導致問題）

JS：

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
}); 
/*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

$("form input:radio").change(function() { 
    if ($(this).val() == "Yes") { 
     document.getElementById("recordType").value = "01220000000FdvyAAC"; 
     alert("Yes"); 

    } else { 
     document.getElementById("recordType").value = "01220000000FffjAAC"; 
     console.log(document.getElementById("recordType").value); 
     alert("No"); 
    } 
});

HTML

<form method='post' id='prechatForm' autocomplete="on"> 
     <div id="bankEmployeeYesNoRadioButtonDiv"> 
      <label>{!$Label.Bank_Employee}</label><br/> 
      <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
      <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
      <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
      <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
     </div> 
</form>

結果：當我點擊一個單選按鈕，沒有任何反應，沒有警報。無控制檯錯誤注意：請注意，我正在使用Salesforce（Visualforce）語法。

來源

2017-06-05 Dante

你會得到什麼錯誤？另外，輸入是自閉的。沒有''。最後，你的例子沒有'

嘗試改變這個$（「form input：radio」）。change（function（）to this $ 「form input [type ='radio']」）。change（function（） –

@ j08691，1）沒有提示2）這是Salesforce（visualforce）的語法，這就是爲什麼我必須使用閉合元素。這只是一個片段而不是完整的代碼4）我會嘗試你最後的建議 – Dante

更改此：

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
}); 
/*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

$("form input:radio").change(function() { 
    if ($(this).val() == "Yes") { 
     document.getElementById("recordType").value = "01220000000FdvyAAC"; 
     alert("Yes"); 

    } else { 
     document.getElementById("recordType").value = "01220000000FffjAAC"; 
     console.log(document.getElementById("recordType").value); 
     alert("No"); 
    } 
});

要這樣：

/*This function is responsible for for the radio buttons*/ 
$(function() { 
    $(".r1").checkboxradio({ 
     icon: false 
    }); 
    /*This function changes the RecordTypeId according to the BankEmployeeCheckbox*/ 

    $("form input:radio").change(function() { 
     if ($(this).val() == "Yes") { 
      document.getElementById("recordType").value = "01220000000FdvyAAC"; 
      alert("Yes"); 

     } else { 
      document.getElementById("recordType").value = "01220000000FffjAAC"; 
      console.log(document.getElementById("recordType").value); 
      alert("No"); 
     } 
    }); 

});

來源

2017-06-05 16:03:45

謝謝它的工作，雖然我不明白爲什麼我需要包裝輸入：document.ready方法中的radio選擇器，如果每次選擇按鈕時都需要它運行... – Dante

那麼我在這裏找到了答案：https：// stackoverflow。com/questions/9657572/jquery-document-ready 我應該在添加更改事件之前等待DOM加載。 – Dante

你的jQuery選擇是錯誤的，所以改變這種：

<div id="bankEmployeeYesNoRadioButtonDiv"> 
    <label>{!$Label.Bank_Employee}</label><br/> 
    <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
    <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
</div>

到：

<form id="bankEmployeeYesNoRadioButtonDiv"> 
    <label>{!$Label.Bank_Employee}</label><br/> 
    <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes"></input> 
    <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
    <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No"></input> 
</form>

來源

2017-06-05 14:01:19

沒有工作，它的行爲相同（沒有控制檯錯誤，沒有警報彈出） – Dante

你有很多錯誤的...你試圖找到你的js 「形式」，但您的HTML中沒有任何表單標籤，您也沒有使用此標識標記：「recordType」。但是，您的提醒很好:)

下一次，只需F12（打開您的瀏覽器控制檯）並閱讀錯誤。

編輯：添加JQuery用戶界面

$("document").ready(function() { 
 
    $(".r1").checkboxradio({ 
 
     icon: false 
 
    }); 
 

 
    $(".r1").change(function() { 
 
     if ($(this).val() == "Yes") { 
 
      alert("Yes"); 
 
     } else { 
 
      alert("No"); 
 
     } 
 
    }); 
 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8" /> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" /> 
 
    <title>Test</title> 
 
</head> 
 

 
<body> 
 
    <!-- Modal Register --> 
 
    <div id="bankEmployeeYesNoRadioButtonDiv"> 
 
     <label>{!$Label.Bank_Employee}</label><br/> 
 
     <label for="radio-1" class="radioLabel">{!$Label.Yes}</label> 
 
     <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-1" class="r1" value="Yes" /> 
 
     <label for="radio-2" class="radioLabel">{!$Label.No}</label> 
 
     <input type="radio" name="liveagent.prechat:BankEmployee" id="radio-2" class="r1" value="No" /> 
 
    </div> 
 
    <!--/ Modal Register --> 
 
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> 
 
    <script src="./script.js"></script> 
 
</body> 
 

 
</html>

來源

2017-06-05 14:03:49 Kashkain

你刪除了我的腳本中非常重要的部分，我需要JQuery插件工作，你評論它。 – Dante

您提供的「已修改」代碼與checkboxradio不兼容 – Dante

我編輯我的答案，我不明白「checkboxradio」是JQuery UI – Kashkain

無法與JQuery一起使用RadioButton - 警報不會彈出

回答

相關問題