3

如何将 DOM 对象(输入)传递给 oncomplete 事件的处理程序,以便我可以操作它的父级?

JSF 代码:

<p:datatable>
...
<p:column>

<h:inputText id="my_field" value="#{bean.my_field}">
    <p:ajax oncomplete="handle_oncomplete( $(this) )" listener="#{bean.handle_change}" />
</h:inputText>

</p:column>
...
</p:datatable>

JS代码:

//NOT WORKING
function handle_oncomplete(my_param) {
  _parent = my_param.parent();                 
  _parent.css( "background", "#123456");
}

我使用 my_param.attr('source') 来访问传递的 DOM 对象:

//WORKING
function handle_oncomplete(my_param) {
  _parent = $(my_param.attr('source')).parent();                 
  _parent.css( "background", "#123456");
}

还有其他方法吗?

编辑: console.log(my_param.parent()) 输出

在此处输入图像描述

编辑:添加代码以重现问题

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<f:view contentType="text/html" locale="fr" encoding="UTF-8">
<h:head>
</h:head>
<h:body>
    <h:form id="dvForm">
        <div id="my_id" style="padding: 50px;">
            <h:inputText id="my_input">
                <p:ajax update="" oncomplete="complete_handler($(this) )"
                    listener="#{bean.handle_change}" />
            </h:inputText>
        </div>
    </h:form>
    <h:outputScript library="primefaces" name="jquery/jquery.js" />

    <script type="text/javascript">
        function complete_handler(my_param) {
             my_obj = my_param.attr('source');
             _parent = my_obj.parent();                 
             _parent.css( "background-color", "#123456");
        }
    </script>
</h:body>

编辑:生成的 html 代码

<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet"
href="/myproject/javax.faces.resource/theme.css.xhtml?ln=primefaces-aristo" /><script 
type="text/javascript" 
src="/myproject/javax.faces.resource/jquery/jquery.js.xhtml;jsessionid=5DDDEBBC02044818081D23A267940E72?ln=primefaces">
</script><script
type="text/javascript"
src="/myproject/javax.faces.resource/primefaces.js.xhtml;jsessionid=5DDDEBBC02044818081D23A267940E72?ln=primefaces">
</script></head><body>
<form id="dvForm" name="dvForm" method="post" 
action="/myproject/test/t1.xhtml;jsessionid=5DDDEBBC02044818081D23A267940E72"
enctype="application/x-www-form-urlencoded">
<input type="hidden" name="dvForm" value="dvForm" />
<div id="my_id" style="padding: 50px;"><input id="dvForm:my_input" type="text" 
name="dvForm:my_input"            onchange="PrimeFaces.ab({source:this,event:'valueChange',process:'dvForm:my_input',oncomplete:function(xhr,status,args){complete_handler($(this) );}},
arguments[1]);" /></div><input type="hidden" name="javax.faces.ViewState" 
id="javax.faces.ViewState" value="5837380100056002382:-3836335094805954101" autocomplete="off" />
</form>
<script type="text/javascript">
function complete_handler(my_input) {
    my_obj = my_input.attr('source');
    $(my_obj).parent().css('background-color', "#123456");
}
</script></body>
</html>
4

0 回答 0