Javascript ui选项卡工作不正常

我使用了ui选项卡，这是我使用的代码：

<script type="text/javascript">
  $(function () {
    $('#tabs').tabs({ event: '' });
  });

  function validateContact() {
    var fname = $('#first_name1').val();

    if (fname == '') {
      alert("Enter Name");
    } else {
      $('#tabs').tabs({ event: 'click' });
      doitcontact();
    }
  }

  function doitcontact() {
    var cnt = $("#frmdocontact").serialize();

    $.ajax({
      type: "POST",
      url: "doitcontact.php",
      data: cnt,

      success: function (msg) {
        var spt = msg.split('#$@$');
        //alert(spt);

        $('#hid_uid').val(spt[0]);
        $('#custom').val(spt[0]);

        $('#hid_add_vehicle').val(spt[0]);
        $('#hid_saleid').val(spt[1]);

        var valreturn = $("#return").val();

        if (valreturn) {
          valreturn = valreturn + "?cntdoit=" + spt[0];
          $("#return").val(valreturn);
        }

        //alert(msg);
        //console.log(contactSent);
        var pkg = $('input:radio[name=pkg]:checked').val();

        var $tabs = $('#tabs').tabs();
        var selected = $tabs.tabs('option', 'selected');
        $tabs.tabs('select', selected + 1);
        //window.location="thankyou.php"
      }
    });

  }
</script>

<ul>
  <li id="tabVInfo"><a href="#tabs-2">Contact Information</a></li>
  <li id="tabVCond"><a href="#tabs-3">Vehicle Information</a></li>
  <li id="tabVPhoto"><a href="#tabs-4">Additional Vehicle Information</a></li>
  <li id="tabVCheck"><a href="#tabs-5">Check Out</a></li>
</ul>

<div id="tabs-2">
  <form id="frmdocontact" name="frmdocontact" method="post">
    <input id="first_name1" maxlength="40" name="first_name" size="20" type="text" />
    <input type="button" id="sub" name="sub" value="Next >>" class="next-product" onclick="validateContact();" />
  </form>
</div>

<div id="tabs-">hhhhhhhhh</div>
<div id="tabs-4">kkkkkkkk</div>
<div id="tabs-5">llllllllll</div>

$（函数（）{
$（'#tabs'）.tabs（{事件：'}）；
});
函数validateContact（）{
var fname=$（'#first_name1'）.val（）；
如果（fname=''）{
警报（“输入名称”）；
}否则{
$（'#tabs'）.tabs（{event:'click'}）；
doitcontact（）；
}
}
函数doitcontact（）{
var cnt=$（“#frmdocontact”）.serialize（）；
$.ajax({
类型：“POST”，
url:“doitcontact.php”，
资料来源：cnt，
成功：功能（msg）{
var spt=msg.split（“#$@$”）；
//警报（spt）；
$（'hid_uid'）.val（spt[0]）；
$（'#custom'）.val（spt[0]）；
$（'hid#u add_vehicle'）.val（spt[0]）；
$（'hid#u saleid'）.val（spt[1]）；
var valreturn=$（“#return”）.val（）；
如果（返回）{
valreturn=valreturn+“？cntdoit=“+spt[0]；
$（“#return”）.val（valreturn）；
}
//警报（msg）；
//console.log（contactSent）；
var pkg=$（'input:radio[name=pkg]：checked'）.val（）；
var$tabs=$（'#tabs'）.tabs（）；
var selected=$tabs.tabs（'option'，'selected'）；
$tabs.tabs（'select'，selected+1）；
//window.location=“thankyou.php”
}
});
}






HHHHHHHHHH
kkkkkkk
llllllllllll

我想在加载页面时删除clicked事件。该操作正常。 然后，如果已经填写了数据，我必须能够单击选项卡。因此，如果我填写了第1页和第2页，并且我在第3页，那么他们应该能够单击1或2选项卡，其中应该包含已经输入的数据

这里第1页和第2页表示div。在我的代码中，当我加载页面时，选项卡不可单击。然后我在第1页输入数据，单击nex按钮，然后转到第2页，所有选项卡现在都可单击

但我需要的是第1页的标签页应该是可点击的

我该怎么做

有人能解决这个问题吗

如果有任何解决方案

尽快给出解决方案………..

只需删除选项卡调用中的{事件：'}即可启用所有单击。然后更改要禁用的选项卡的HREF。在本例中，我禁用了“签出”选项卡

$("#tabs").tabs();
$("#tabVCheck > a").attr("href", "#");

您可以在此处进行测试：

---

@rahul我不知道如何制作js小提琴…jsfiddle.net，把你的代码放在那里，它可以帮助我们理解你的想法和想法problem@Christian但是我不知道如何在JSFIDLE中包含js和css文件…您可以通过提供虚假数据来隔离问题。。。创建一个显示问题的测试。但是我在这里给出了一个答案，我不知道它是否会有帮助，但值得一试：-@rahul这是jsfiddle，但唯一的cick不起作用，我不知道如何设置它……好的，那么我建议您使用jsfiddle中的假数据创建一个测试。我们必须清楚地了解您的需求以帮助您，这一点很重要。我不能将jquery1.7.1包含在JSFIDLE中。我怎样才能加载它？@Chrisian看看这把小提琴：

http://jsfiddle.net/svierkant/hpU3T/1/

在这里，我用我的代码进行编辑，然后我可以看到设计正确的代码。@Christain，所以我登录我的fiddle帐户，并尝试用我的帐户中的代码创建相同的代码，但是我可以从左侧下拉列表中加载

Jquery 1.7.1

，为什么？或者如何加载？这是我创建的fiddel，但设计中断

http://jsfiddle.net/mariya/T9KKT/16/