试试这个

function connect()
 {      
  var BID = document.getElementById('BID').value;
  var REF = document.getElementById('ref_po').value;
  var POU = document.getElementById('po_units').value;
  var site_url = document.getElementById('site_url').value;
  var url = site_url+'main/transacIn';
  $.ajax({
   type: "POST",
   url: url,
   data: {
            BID : BID ,
            REF: REF,
            POU:POU
        },
   success: function(data) { 
    //$("#bid").hide();
    alert(BID);
    },
   error: function(err) { 
    console.log(err);
    }
  });
}

您应该在相应的页面<input id="site_url" type="hidden" value="<?php echo site_url(); ?>"/>中隐藏字段

您不能将php语法注入javascript文件。您可以在codeigniter模板文件中定义脚本为

<script type="text/javascript">
// Your javascript function
</script>

...或者您可以在模板文件中定义一个javascript变量，该变量实际上获取控制器的路径：

var url = <?php echo base_url()."index.php/main/transacIn/"  ?>';

然后在 AJAX post上的javascript文件中，指向模板文件中定义的变量：

$.ajax({
    type: "POST",
    url: url,
    data: 'BID='+BID +'&REF='+REF +'&POU='+POU,
    success: function(data) { 
        //$("#bid").hide();
        alert(BID);
        }
    });

希望你明白。
无论如何，定义全局变量时要小心，使用名称空间来保护变量是一个很好的做法。

试试这个解决方案。它会起作用的：

$.post(url , {BID: BID, REF: REF, POU:POU },
    function(data){
    alert(BID);
});