Jquery 我希望我的功能在新表行中工作

我有一个JSFIDLE，用户在其中打开一个网格并选择一个选项，在用户选择一个选项后，如果他们单击“AddQuestion”按钮，那么它将在一个新表行中显示该选项

正如您在新表格行中看到的，它还显示了文本框和打开的网格链接。我这样做是因为假设您添加了一个选项，但随后意识到您选择了错误的选项，我希望用户能够单击任何相关行中的“开放网格”链接，并单击他们喜欢的选项。因此，换句话说，我希望用户能够在表行中选择一个选项，就像他们在新行中添加选项之前使用上述功能选择选项一样

我正在使用.on（）函数来执行此操作，但我的问题是，如果我尝试打开其中一个输出行中的网格，它将无法打开网格。那么，我如何才能获得它，以便用户可以像从上述功能中选择选项时一样从表行中查看选项

我的代码在JSFIDLE中，单击，如果有人有想法，请随意使用FIDLE来测试您的想法

谢谢

更换该功能：

  $('.showGrid').on('click', function(e)

    {

        if ($('#optionTypeTbl').css("display") == "table") {

            $('#optionTypeTbl').hide();

        } else {

            $('#optionTypeTbl').fadeIn('slow');
            $('#optionTypeTbl').css("display", "table");

        }
        e.stopPropagation();
    });

与：

请参见您需要更换的

 $('.showGrid').on('click', function...

与

获取类似

.live（）

的功能。您还需要在附加到

.showGrid

的链接上更改

.showGridRow

类，或者进行以下附加更改：

 $(document).on('click', '.showGrid,.showGridRow', function...

这就留下了一个问题，“网格”会出现在同一个地方，不管你点击哪里。我通过在“显示”代码中添加以下行来解决此问题：

---

对于添加的行，您需要使用.live（），因为它监视dom的更新并将函数附加到事件。因此，您可以执行以下操作

$('.showGridRow').live(function(event){
event.preventDefault;
alert('code goes here');
});

您还需要使用一个变量来存储要更新其值的输入

input_box = $(this).parent().find('input');

然后在选项select callback中使用input_box.val（）；后者

---

请参阅工作演示。

我知道这并没有回答您的具体问题（我仍然可以帮助您），但为什么不只添加一个

删除行

选项呢？这将涉及更少的代码，而且将来可能更容易维护。因为在将来，用户不仅要添加选项类型，还要添加一个问题、一个选项、一个答案、一个问题权重和一个问题持续时间，如果用户删除一行，那么他们将必须再次填写详细信息，而如果他们可以编辑一行，则可能比删除一行并再次填写所需的时间要少，老实说，允许用户编辑该行中的功能或可能删除一行是一个好主意，如果他们犯了一个巨大的错误，你认为如何？对我来说这听起来不错；p尽管不总是正确，gui越灵活，用户体验就越好。既然已经有了

.on

，为什么还要回到

.live

？（尽管jQuery在内部将一个转换为另一个，但仍然如此。）我注意到，

.showGridRow

没有绑定到单击事件，因此我将两个选择器组合起来，并将单击事件绑定到它们，效果很好。嗨，唯一的问题是如果我单击“打开网格”“链接一行并选择一个选项，假设更改该行文本框中的值而不是顶部文本框中的值HI，唯一的问题是，如果我单击一行中的“开放网格”链接并选择一个选项，则假设更改该行文本框中的值而不是顶部的值。”textbox@mblase75这可能是最好的办法，但您也可以获取单击元素的上下文，以确定所使用框的位置。如何为每个输入指定不同的名称，因为它只是一行代码，显示每行的输入？这是一个复杂的修复方法，因为您需要某种方法来告诉“网格”您希望接收数字的文本字段。我认为这是一个单独的问题。好吧，那么我会这样做，谢谢：）如果我在任意行上点击打开网格，它就不会打开网格。

        $('#optionTypeTbl').css({
            left: $(this).position().left,
            top: $(this).position().top + 20
        });

$('.showGridRow').live(function(event){
event.preventDefault;
alert('code goes here');
});

input_box = $(this).parent().find('input');