如何在jquery-ui 10.4中获取标题标题

时间:2014-04-23 20:59:37

标签: jquery jquery-ui jquery-tabs

尽我所能,我似乎无法在Jquery ui 10.4中获得Tab Title。我想将其添加为.data,以便将其发送到Dialog窗口。我已经使用Tab ID执行此操作,但我似乎无法用标题来弄明白。这就是我对ID的看法。

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

$( "#add_item_dialog" )
.data('curtab', $('#tabs').tabs('option','active')).dialog( 'open' );

  });
});

我发现使用Google的所有内容似乎只有在您使用旧版本的JQuery时才能运行。

我错过了什么吗?

编辑:

我想我应该更彻底。你让我得到了我需要的部分,这是获得Tab标题,但我似乎仍然无法使它工作。我基本上将选项卡ID和选项卡标题发送到对话框窗口,以便我可以填充一些HTML输入元素。到目前为止,我能够打开窗口并使用ID填充文本框。现在我想在标题的同一窗口中填充另一个文本框。这是我的整个打开对话框代码。

我在页面上有一个id ='add_item_opener'的按钮,效果很好。我认为我最大的问题是如何使用.data()发送多个变量。

<!--Open add item dialog box-->
<script>
  $(function() {
    $( "#add_item_dialog" ).dialog({
      height: 550,
      width: 400,
      autoOpen: false,
      create: function() {
           $('#curjobNum').val('154');
        },
      open : function (event, ui) {
           var curTab = $('#add_item_dialog').data('curtab');
           $('#curtabNum').val(curTab);
          },
      buttons: {
    },
      position: {
        my: "center top",
        at: "center top",
        of: "#tabs"
      },
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "clip",
        duration: 1000
      }

    });

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

    $( "#add_item_dialog" )
    .data('curtab', $('#tabs').tabs('option','active')).dialog( 'open' );

    });
  });
  </script>

这是我的对话窗口:

<td><button id='add_item_opener'>Add a New Bid Item</button>
<div id='add_item_dialog' title = 'Bid Item Form' style = 'background-color: #ccc;'>
<br><br>
<form method='POST' action='' id='newBidItem'>
<table class='small' style = 'background-color: #ccc;'>
    <tr><td>Tab/Title</td><td><input type='text' id='title' value='' readonly='readonly' /></td>
    <tr><td>Company Name</td><td><input type='text' name='company' style='width: 150px;' value='' /></td>
    <tr><td>Qty</td><td><input type='text' name='qty' style='width: 35px;' value=''  /></td> 
    <tr><td>Description</td><td><textarea name='descript' cols='35' rows='5' ></textarea></td> 
    <tr><td>Material Spec</td><td><input type='text' name='materialSpec' value='' /></td>
    <tr><td>Delivery</td><td><input type='text' name='delivery' value='' class='date-pick' /></td>
    <tr><td>Unit Cost</td><td><input type='text' name='unit_cost' value=''  /></td> 
    <tr><td>Discount % (if any)</td><td><input type='text' name='discount' value=''  /></td>
</table>
    <input type='hidden' value='' id='curtabNum' name='curtabNum' />
    <input type='hidden' value='' id='curjobNum' name='curjobNum' />
    <tr><td><input type='submit' value='Save' name='saveBidItem' id='saveBidItem' /></td>

</form>
</div>

感谢所有帮助,因为我是一个严肃的JQuery noob。

1 个答案:

答案 0 :(得分:1)

你的帖子中有2个问题吗?我会回答这个问题:

  

如何获取选定的标题标题?

首先,看一下这个例子:jsFiddle

这是你想要达到的目标吗?选择一些标签,然后按click me链接。将显示带有所选选项卡名称的警报。

Java脚本代码:

var selected = $("#tabs").tabs("option", "active");
var selectedTabTitle = $($("#tabs li")[selected]).text();
alert(selectedTabTitle);

很简单。告诉我,如果你需要评论。

Source

注意,如果您使用jQuery&lt; = 1.8,则必须使用tabs("option", "selected");,但如果您使用jQuery&gt; 1.8你必须使用tabs("option", "active");source

如果您对如何打开对话框有疑问,请为其创建新帖子。