Question

我要做的是获取输入到文本区域的用户信息，根据某人的程度显示为消息。因此，如果我选中BA的方框，则光标会聚焦在BA文本区域，具体取决于我输入的内容：让我们说：科学，消息将显示为firstName +＆＃34;您拥有以下学位：
BA在科学。＆＃34;或者如果我在MA文本区域上选中MA复选框和光标.focus（es）并输入Business，则它将显示为＆＃34; firstName +＆＃34;你拥有以下学位：。商业硕士。＆＃34;等任何帮助表示赞赏。

HTML CODE：

<div id="mycbxs">
        <br><strong>&nbsp;</strong>
        <br><input type="checkbox" id="BAcbx" value="B"> BA
        <br><input type="checkbox" id="MAcbx" value="M"> MA
        <br><input type="checkbox" id="PHDcbx" value="P"> PHD
    </div>

    <div id="myinputs">
        <br><strong>Discipline</strong>
        <br><input type="text" id="BAText" size="30">
        <br><input type="text" id="MAText" size="30">
        <br><input type="text" id="PHDText"  size="30">

        <br><br>
        <input type="button" id="myclick" value="Submit Degree Info">
        <br>
        <p id="message"></p>
    </div>

jQuery CODE：

      $(document).ready(function(){

 $("#myclick").click(function(){

     var myFirst = $("#first_name").val().trim();
     $("#first_name").val(myFirst);

     var myMessage = myFirst + "." + " You have yet to earn any degrees.";

     if(!myFirst)
     {
     $("#message").text() = "";
     }
     else
     {
       $("#message").text(myMessage);
     } 

 });


 $("input[type='checkbox']").click(function(){

  var radioButtonsChecked = $("#mycbxs input[type ='checkbox']:checked").val();

   $("#myinputs input[type ='text']").val();

  if(radioButtonsChecked == "B") 
   { 
    $("#BAText").focus(); 
   } 
   if(radioButtonsChecked == "M") 
   { 
    $("#MAText").focus(); 
   } 
   if(radioButtonsChecked == "P") 
   { 
    $("#PHDText").focus(); 
   }
 });




 $("#myclick").click(function(){

     var myFirst = $("#first_name").val().trim();
     $("#first_name").val(myFirst);

    $("#myinputs input[type ='text']").val();


     var myDegree = '';

     var radioButtonsChecked = $("#mycbxs input[type ='checkbox']:checked").val();

     var myMessage = myFirst + "." + " You have yet to earn any degrees.";

     if(!myFirst)
     {
     $("#message").text() = "";
     }
     else
     {
       $("#message").text(myMessage);
     } 


    if(radioButtonsChecked  == "B") 
    {
        myDegree = $("#BAText").val();
    }

    if(radioButtonsChecked  == "M") 
    {
        myDegree = $("#MAText").val();
    }

    if(radioButtonsChecked  == "P") 
    {
        myDegree = $("#PHDText").val();
    }

    var myMsg = myFirst + " You have the following degrees:" + "<br>" + "<br>" + myDegree;

    $("#message").html(myMsg);
});


});

Answer 1

一些问题：

$("#message").text("");语法无效。它应该是`
在错误的地方有一些反叛input[type ='text']:checked;也许是你问题中的拼写错误
同一个按钮有两个点击处理程序，原则上不一定是个问题，但在这里它们都设置了消息。所以第一个处理程序确实无关紧要。
CSS选择器text与任何内容都不匹配，因为无法检查$(document).ready(function(){ var degree = { B: $("#BAText"), M: $("#MAText"), P: $("#PHDText") }; $("#mycbxs input[type='checkbox']").click(function(){ if ($(this).is(":checked")) degree[$(this).val()].focus(); }); $("#myclick").click(function(){ var myFirst = $("#first_name").val().trim(); $("#first_name").val(myFirst); var $checked = $("#mycbxs input[type='checkbox']:checked"); var myDegrees = $checked.map(function () { return $(this).attr("name"); }).get().concat($checked.map(function () { return degree[$(this).val()].val(); }).get()).join(', '); var myMsg = !myFirst ? "Please enter your name." : myDegrees ? myFirst + ". You have the following degrees: " + myDegrees : myFirst + ". You have yet to earn any degrees."; $("#message").text(myMsg); }); });输入元素。

有些事情也可以用更有效和简洁的方式编写：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="first_name" value="John"> 
<div id="mycbxs">
    <input type="checkbox" id="BAcbx" value="B" name="BA"> BA
    <br><input type="checkbox" id="MAcbx" value="M" name="MA"> MA
    <br><input type="checkbox" id="PHDcbx" value="P" name="PHD"> PHD
</div>

<div id="myinputs">
    <strong>Discipline</strong>
    <br><input type="text" id="BAText" size="30">
    <br><input type="text" id="MAText" size="30">
    <br><input type="text" id="PHDText"  size="30">

    <br>
    <input type="button" id="myclick" value="Submit Degree Info">
    <span id="message"></span>
</div>

＆＃13;

withRouter

＆＃13;

获取复选框和文本区域的文本以使用jQuery显示

1 个答案: