-1

我有一个网络项目，我将一些带有创建的 html 代码的问题注入到 html 页面中。由于这些 html 对象是动态创建的，我不知道会有多少问题以及它们的 ID 是多少。我需要得到选定的答案。

这里有一段动态创建的html代码和一些带有JSFiddle演示的javascript函数。我尝试获取所选答案的 nextPage 功能不起作用。

function nextPage() {
var results = new Array();
var contents = $(this).parents("div").parents("div").find("input");
contents.filter(":checked").each(function () {
    var idx = $(this).index();
    results.push($(this).parent().children().get(idx + 1).innerHTML);
    alert($(this).parent().children().get(idx + 1).innerHTML);
});
contents.filter(":text").each(function () {
    results.push($(this).val());
});

alert(results.join(";"));
pageNumber += 1;
window.location = '#question' + pageNumber;
}

JSFiddle 演示

如何获得选定的答案？任何帮助将不胜感激。

4

3 回答 3

1

尝试以下（这就是你要找的）：

 var pageNumber = 1, isLastPage = 2, results = [];

function nextPage() {

  var contents = $('#question' + pageNumber).find(".answers");    

  contents.filter(":checked").each(function () {        
    var text = $(this).next().find("span.ui-btn-text").text();
     if( text == undefined || text == ""){
         text = $(this).parent().next().text();
     }
    results.push(text);       
  });

   pageNumber += 1;

  if(pageNumber > isLastPage){
     alert("Test Finished, all answers are : " + results.join(";"));
     return;   
  }
   window.location = '#question' + pageNumber;
}

function prevPage() {
   pageNumber -= 1;
   window.location = '#question' + pageNumber;
}

在这里工作小提琴：http: //jsfiddle.net/REthD/5/

我希望它有帮助。

于 2013-08-17T21:40:10.767 回答
0

我已将@maverickosama92 解决方案更新为更简单的方法，看看这是否是您所需要的。

在这里工作小提琴http://jsfiddle.net/REthD/7/

更简单的方法：

var pageNumber = 1, isLastPage = 2, results = [];

function Responses()
{
    var jqResponses = $('body').find(":checked");
    var arrResponses = [];
    jqResponses.each(function(){
        arrResponses.push($('label[for*="' + this.id + '"]').text());
    })

    alert('Responses: ' + arrResponses.join(";"))
}

function nextPage() {

    pageNumber += 1;

    if(pageNumber > isLastPage){
        Responses();    
        return;   
    }
    window.location = '#question' + pageNumber;
}

function prevPage() {
    pageNumber -= 1;
    window.location = '#question' + pageNumber;
}
于 2013-08-17T22:11:03.650 回答
0

由于您没有使用 jquery 创建单击事件，因此您的 $(this) 没有获取按钮元素，而是获取了窗口对象。然后将窗口对象传递给 jquery。

当从 onclick 事件调用时，函数中this的值将是对全局（窗口）对象的引用。（见链接）

您可以通过使用 jquery 添加单击事件并从 html中删除onclick="nextPage()"来解决它。与此类似的东西（当然，您应该只将其应用于“下一个按钮”）：

$('input[type=button]').bind('click',nextPage);

或者你可以继续在 html 中使用你的onclick="nextPage()"并且你可以像这样获得点击按钮：

var $clickedButton = $(this.event.target);

所以你的功能将是：

function nextPage() {

    var results = new Array();
    var contents = $(this.event.target).parents("div").parents("div").find("input");
    contents.filter(":checked").each(function () {
        var idx = $(this).index();
        results.push($(this).parent().children().get(idx + 1).innerHTML);
        alert($(this).parent().children().get(idx + 1).innerHTML);
    });
    contents.filter(":text").each(function () {
        results.push($(this).val());
    });

    alert(results.join(";"));
    pageNumber += 1;
    window.location = '#question' + pageNumber;
}

新的 JSFiddle 更新演示

我不太了解jquery mobile。而且我不知道将事件放在 html 上是否是绑定单击事件的最佳方法，但我想使用 jquery 绑定单击事件会更好。

JSFiddle 使用 jquery 绑定事件

于 2013-08-18T03:14:16.203 回答