Question

我将此代码放在Sharepoint WebPart的.ascx文件的底部：

<script>
$(document).ready(function () {
    alert("The ready function has been reached");
    $('#ckbxEmp').on("change", function () {
        if ($('#ckbxEmp').prop("checked")) {
            alert("Checked");
        } else {
            alert("Not checked");
        }
    });
});
</script>

在运行WebPart（打开嵌入了WebPart的页面）时，我看到＆＃34;已到达就绪功能＆＃34;警告，但点击复选框后，没有警报。

在相应的.ascx.cs文件中创建复选框：

var ckbxEmployeeQ = new CheckBox
{
    CssClass = "finaff-webform-field-input",
    ID = "ckbxEmp"
};

它适用于jsfiddle here：

我也尝试将.ascx文件中的代码更改为：

<script>
$(document).ready(function () {
    alert("The ready function has been reached");
});

$('#ckbxEmp').on("change", function () {
    if ($('#ckbxEmp').prop("checked")) {
        alert("Checked");
    } else {
        alert("Not checked");
    }
});
</script>

...认为我可能需要将事件处理程序与＆＃34; ready＆＃34;分开。功能，但没有区别 - 仍然没有显示对复选框的更改/点击的任何响应。

为什么不呢？

更新

我尝试了SouXin的代码，但我仍然只看到＆＃34;已经达到了准备好的功能＆＃34; - 点击复选框既不会显示我，也不会显示＆＃34;已选中＆＃34;也没有＆＃34;没有检查＆＃34;

我试过了：

$(document).ready(function () {
    alert("The ready function has been reached");

    $(document).on("change", '#ckbxEmp', function () {
        if ($(this).prop("checked")) {
            alert("Checked");
        } else {
            alert("Not checked");
        }
    }); 
});

......然后这个：

$(document).ready(function () {
    alert("The ready function has been reached");
});

$(document).on("change", '#ckbxEmp', function () {
    if ($('#ckbxEmp').prop("checked")) {
        alert("Checked");
    } else {
        alert("Not checked");
    }
});

......最后这个：

$(document).ready(function () {
    alert("The ready function has been reached");

    $(document).on("change", '#ckbxEmp', function () {
        if ($('#ckbxEmp').prop("checked")) {
            alert("Checked");
        } else {
            alert("Not checked");
        }
    }); 
});

......但每次都得到相同的（半令人鼓舞的，半令人沮丧的）结果。

更新2

Redi追求任何线索，我遵循了克劳迪奥的建议和＃34;观察源＆＃34;。

我发现，除了在jQuery中逐字逐句地找到，＆＃34; ckbxEmp＆＃34;也是一个长期存在于威尔士的威尔士＆＃34;前缀，其中怪物（这使得弗兰肯斯坦看起来像杰西卡阿尔巴）做三重任务，为＃34; id＆＃34;，＆＃34;名称＆＃34;和＆＃34;为＆＃34;：

<td><span class="finaff-webform-field-input"><input id="ctl00_ctl24_g_1caf4ad1_092d_4224_bd10_28ab028aab50_ctl00_ckbxEmp" type="checkbox" name="ctl00$ctl24$g_1caf4ad1_092d_4224_bd10_28ab028aab50$ctl00$ckbxEmp" /><label for="ctl00_ctl24_g_1caf4ad1_092d_4224_bd10_28ab028aab50_ctl00_ckbxEmp">Employee?</label></span></td>

因此导致another question。

更新3

工作解决方案是SoulXin和上面提到的答案的组合（＆＃34;另一个问题＆＃34;链接）。要简洁，因为它已经被Welshified，所以必须以这样的方式找到它：[id $ = ckbxEmp]

Answer 1

通常在动态创建元素时发生。试试这个：

$(document).on("change", '#ckbxEmp', function () {
   if ($(this).prop("checked")) {
       alert("Checked");
   } else {
       alert("Not checked");
   }
});

查看Direct and delegated events

<强>更新

完整代码：

<script>
 $(document).on("change", '#ckbxEmp', function () {
   console.log('Function has been reached');
   if ($(this).is(":checked")) { //better
       alert("Checked");
   } else {
       alert("Not checked");
   }
 }); 
</script>

顺便说一下，最好使用console.log('test')而不是警报。此外，看看你的帖子的第一评论。 ASP在客户端更改id。您需要#ckbxEmp

，而不是<%= ckbxEmp.ClientID %>

为什么这个jQuery无法在我的Sharepoint页面上运行？

更新

更新2

更新3

1 个答案: