在javascript中if/else后，jQuery对话框不可见

Question

在一个简单的html页面上，用户点击一个按钮，上面写着“添加问题”。

有了这个“单击”，就会弹出一个jQuery对话框，在原始页面上弹出一个“隐藏”表(display: none)。

用户在jQuery对话框的输入字段中输入"number“(对于熟悉医疗代码的用户来说是ICD-9代码)。

当用户单击.dialog按钮时，该数字将被读取、裁剪并发送到if/ and的第一部分。

如果数字是<3个字符，则在div中显示“这不是有效的icd-9代码”的消息。

(如果它是有效的，我将进行.ajax调用，查看是否有相应的icd-9，如果没有给出消息"No icd-9“，或者给出icd-9代码和icd-9文本)

所有的第一部分都工作得很好，除了上传了“错误”消息之后，用户立即返回到原来的html页面，而不是.dialog。(我几乎看不见消息--我发布了一个警告来阻止消息流并确认消息在那里)。

下面是所讨论的代码：

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

    varicd9 = document.getElementById('icd9input').value;
    varicd9 = varicd9.trim();

    if (varicd9.length < 3)
       {
        document.getElementById("listicd9").innerHTML = varicd9 + "is not a valid ICD-9 Code";
        return;
       }
         else
       {$.ajax({
                type: "POST",
                url: readicd9backend.php,
                data: {icd9: varicd},
                dataType : 'json', 
                              success: function(result)
                                       {
                                        $("#div1").html("");
                                        if(result.length >= 1)
                                           {
                                            var output = "<table width='500px' class = 'findtable'>";
                                           $.each(result, function(index, value)
                                                 { output += "<tr><td id='icd9' width='50px'>" + value.icd9codedot +
                                                             "</td><td width='250px' style='text-align:left'>" + value.icd9long +
                                                             "</td></tr>";
                                             });
                                         output += "</table>";
                                         $("#listicd9").html(output);
                                     }
                                      else
                                     {$("#listicd9").html("No matches");}
              },
              error : function(e) { ("#listicd9").html('Database access error'); }
            });            
       }
});

我尝试添加一个"retun“(正如您在上面看到的)，并在没有”返回“的情况下完成它，它总是让我回到原来的html页面。

这个“流控制”的问题对我来说是一个新的问题，所以我希望得到任何帮助，甚至只是一个参考，这样我就可以自己破解这个问题了。

再次，我非常感谢大家。

编辑:这是点击函数；

$("#addproblementerbutton").click(function() {
 $(function() {  $( "#addproblemtable" ).dialog({
                                                height: 550,
                                                width: 600,
                                                modal: true
                                                });
               });
});

这是整张桌子：

<!--start of hidden add problem table-->
<div id="addproblemtable" style="display:none" title="Add a Problem"><!--start of add problem div/table-->
<form id="addproblem">
<table id="addproblem" class="addproblemtable">
  <tr>
    <td style="width:200px; text-align:right;">ICD-9:</td>
    <td><input id="icd9input" type="text"></td>
    <td><button id="findbuttonicd9">FIND ICD-9</button></td>
  </tr>
  <tr>
    <td style="width:200px; text-align:right;">Problem:</td>
    <td><input id="problem" type="text"></td>
    <td><button id="findbuttontext">FIND TEXT</button></td>
  </tr>
  <tr>
    <td colspan="3">
      <div id = "listicd9" style="width:100%; height:200px; overflow-y:scroll; margin-top:10px; margin-bottom:10px; background-color:#F1E2FE">
      </div>
    </td>
  </tr>
  <tr>
    <td style="width:200px; text-align:right;">Date Noted:</td>
    <td><input id="dateonset" type="text"></td>
    <td></td>
  </tr>
  <tr>
    <td style="width:200px; text-align:right;">Date Entered:</td>
    <td><input id="dateentry" type="text"></td>
    <td></td>
  </tr>
  <tr>
    <td colspan="3">
      <input type="radio" id="active" name="status" value="Active" checked="checked" />
      <label class="styleradiobutton"  for="active">Active</label></input>
      <input type="radio" id="inactive" name="status" value="Inactive" />
      <label class="styleradiobutton" for="inactive">Inactive</label></input>
    </td>
  </tr>
  <tr>
    <td colspan="3" style="width:200px; text-align:center;">
      <input id="resetbutton" type="reset" value="RESET" class="formbutton"><!--reset the form-->
      <input id="addproblemsubmitbutton" type="button" value="ADD" class="formbutton"></td>
  </tr><!--add a problem button-->
  <tr>
    <td><div id=listicd9></div></td>
  </tr>
</table>
</form>
</div><!--end of add problem div/table-->

下面是您单击的.dialog表中的行，以启动if/else/ajax

  <tr>
    <td style="width:200px; text-align:right;">ICD-9:</td>
    <td><input id="icd9input" type="text"></td>
    <td><button id="findbuttonicd9">FIND ICD-9</button></td>
  </tr>

PS -我还没有完成.ajax调用，因为我无法通过调试中的第一个if/else。还在做这个。

谢谢!

Answer 1

好的，我拿起你的小提琴和把它叉开来多用你原来的javascript。

这一切都变了

varicd9 = document.getElementById('testinput').value;
varicd9 = varicd9.trim();

至

var icd9 = $('#testinput').val();
icd9 = icd9.trim();

对于出现的控制台错误，还有其他一些调整可以作出反应。考虑到这是一种抽象，它可能不会完全解决您的问题。

Answer 2

我发现问题了！

出于一个“很好的理由”(我忘了它是什么)，我把桌子放在一个div里。显然，表在div中的工作方式不同(即使div有不同的名称)。

所以我把div拿走了，把桌子抬高了一点，现在一切都很好！

对我来说，学习的重点不是把东西包含在div中，除非它是绝对必要的。

谢谢大家的意见和帮助！